Javascript 仅当第一行数据已填充且下拉状态为“更改”时，才动态克隆或创建该行

下面的代码创建html表并创建一个静态行，然后单击按钮创建同一行，但我的问题是我不想这样做

单击按钮创建或克隆行

应在上创建该行。如果该行的textbox数据不为null且选择值为not test，则需要在该行下方创建新行

HTML:

JS:

---

试试这个-只为第一个输入工作就是一个例子

我将select重命名为selectbox

并修改如下条件

if(typeof selectLastRow !== 'undefined' 
   && selectLastRow != '' 
   && selectLastRow != 'test'
   && emptyInputs == 0
) { ....

---

您可以使用这种方法

聚焦表单元素时，检查并保存所有表单元素的当前状态 一旦表单元素的内容将该元素的set data filled更改为true，请查看当前行上的所有元素是否都有数据填充集。 如果设置了“数据填充”，则如果该行的“数据完成”属性未设置为true，则添加新行并将“行数据完成”属性设置为true 由于所有行都是动态添加的，因此将使用委派事件。 $“结果”。附加“测试2” ; $'results'。关于'focus'，'input'，函数{ $this.closest'tr'.filterfunction{ return！$this.data'saved'； } .find'：input'.eachfunction{ $this.data'value'，this.value； $this.最近的'tr'。数据'saved'，true； }; } .on'input change'，'：input'，函数{ $this.data'filled'，this.value！=$this.data'value' var tr=$this.最近的'tr'； all=tr.find'：输入'， fld=all.filterfunction{ 返回$this.data'filled'； }; 如果all.length==fld.length{ 如果！tr.data'done'{ $'ButtonClock'[0]。单击； tr.数据“完成”，为真； } }否则{ 如果tr.data“完成”{ tr.next'tr'。移除； tr.数据“完成”，错误； } } }; $'ButtonClock'。单击，函数{ var lastRow=$'productanddates'。最近的'productanddates'。findtr:最后一个子项； var clone=lastRow.clone； 克隆。查找“输入，选择”。每个函数{ var id=$this.attr'id'； var regIdMatch=/^.+\d+$/； var aIdParts=id.matchregIdMatch； var newId=aIdParts[1]+parseIntaIdParts[2]，10+1； $this.attr'id'，newId； $this.attr'name'，newId； }; 克隆的.findinput[type='text'].val； 克隆的.insertAfterlastRow； }; .隐藏{ 显示：无； }

---

我不明白你的意思goal@carlodenaro，oops抱歉：，要删除该按钮，请说我要创建一个新行，它是通过单击按钮立即创建的，但是我想创建新行，如果第一行的所有文本框值都已填充，那么将创建一行，因为它现在是在按钮单击上创建的。谢谢，一切都很完美，但是如果没有按钮单击，就不能创建新行。如果所有条件都满足，则在下面创建一行，如此@PeterKA，如果你不介意的话，我有一个快速的问题，如果上面的文本框有一个值为null或者选择值为testCode，那么下面的所有行可以被删除吗。请告诉我你是否在找。需要帮助吗？我可以告诉你一些时间我在这里有个问题问题，问题是在没有手动键入某些数据之前不会创建新行。我尝试在下拉列表更改时为某些文本框生成值，但在下拉列表更改时，这些值填充在文本框和仍然没有创建行。请听演示您想问一个新问题吗。

    $('#results').append('<table width="100%" border="1" cellspacing="0" cellpadding="5" id="productanddates" class="border"> <tr><td> <input type="text" name="to1" id="to1" value="" /> </td> <td> <select name="Phonenumberdd1" id="Phonenumberdd1"> <option value="test">test </option> <option value="demo">demo</option></select></td> <td>   <input type="text" name="renewal_by1" id="renewal_by1" />  </td>   <td> <input type="text" name="Renivaul_to1" id="Renivaul_to1" value="" /> </td></TR></TABLE>'
);


    $('#buttonclck').on('click', function () {
        var lastRow = $('#productanddates').closest('#productanddates').find("tr:last-child");

        var cloned = lastRow.clone();
        cloned.find('input, select').each(function () {
            var id = $(this).attr('id');

            var regIdMatch = /^(.+)(\d+)$/;
            var aIdParts = id.match(regIdMatch);
            var newId = aIdParts[1] + (parseInt(aIdParts[2], 10) + 1);

            $(this).attr('id', newId);
            $(this).attr('name', newId);
        });

cloned.find("input[type='text']").val('');
        cloned.insertAfter(lastRow);
    });

$('#buttonclck').on('click', function () {
    var lastRow = $('#productanddates').closest('#productanddates').find("tr:last-child");

//eg. if input[0] value isnt ""
if(lastRow.find('input')[0].value !== "") {

    var cloned = lastRow.clone();
    cloned.find('input, select').each(function () {
        var id = $(this).attr('id');

        var regIdMatch = /^(.+)(\d+)$/;
        var aIdParts = id.match(regIdMatch);
        var newId = aIdParts[1] + (parseInt(aIdParts[2], 10) + 1);

        $(this).attr('id', newId);
        $(this).attr('name', newId);
    });

    cloned.find("input[type='text']").val('');
    cloned.insertAfter(lastRow);
}
});

$('#buttonclck').on('click', function () {
        var lastRow = $('#productanddates').find("tr:last-child");
        var selectLastRow = lastRow.find('select[name=selectbox]').val(); // <-- add this select value

        if(typeof selectLastRow !== 'undefined' && selectLastRow != '' && selectLastRow != 'test') { // <-- add this condition

        var cloned = lastRow.clone();
        cloned.find('input, select').each(function () {
            var id = $(this).attr('id');

            var regIdMatch = /^(.+)(\d+)$/;
            var aIdParts = id.match(regIdMatch);
            var newId = aIdParts[1] + (parseInt(aIdParts[2], 10) + 1);

            $(this).attr('id', newId);
          //  $(this).attr('name', newId); // REMOVE THIS BECAUSE WE FIND IN TR
        });

        cloned.find("input[type='text']").val('');
        cloned.insertAfter(lastRow);
    }
    });

var emptyInputs = lastRow.find('.input').filter(function () { return this.value.length == 0; }).length;

if(typeof selectLastRow !== 'undefined' 
   && selectLastRow != '' 
   && selectLastRow != 'test'
   && emptyInputs == 0
) { ....