Question

当用户点击＆＃34; +＆＃34;按钮，然后应添加一个下拉和输入字段的行。我想将输入字段名称作为每行的下拉值。
如果我选择＆＃34; facebook＆＃34;在第一个下拉列表中，它不应该显示在第二个下拉列表中。只需选择值不应显示在下一个下拉列表中。我做了那个部分。但我的问题是，如果我选择＆＃34; Google＆＃34;在第二次下拉，＆＃34;雅虎＆＃34;在第三次下拉。再次，如果我点击第一个或第二个下拉列表，它不应该显示＆＃34;雅虎＆＃34;再次。

请在下面找到代码所在的链接并进行修复。

http://jsfiddle.net/mhmdsohail/v9uem13u/5/

$(document.body).on('click', '.add-more', function (e) {
    var lastSelect = $("select").last().find('option');
    var toAppend = '';
    if (lastSelect.length > 1) {
        toAppend += '<select name="select[]">';
        $.each(lastSelect, function (i, v) {
            if ($(this).text() !== $("select:last option:selected").text())
                toAppend += '<option value="' + $(this).val() + '">' + $(this).text() + '</option>';
        });
        toAppend += '</select>';
        toAppend += '<input type="text" name=""><br>';
    }
    $(".append-select").append(toAppend);
});

Answer 1

此JavaScript代码可满足您的要求：

（根据我的理解。这将删除所有当前dropdowns（以及将来的所有选项）中的选定选项，下一个输入字段将包含属性name，其值等于最后选择的dropdown选项）

 $(document.body).on('click', '.add-more', function (e) {
                var lastSelect = $("select").last().find('option');
                var selectedOption = $('select:last').val();
                var toAppend = '';
                if (lastSelect.length > 1) {
                    toAppend += '<select name="select[]">';
                    $.each(lastSelect, function (i, v) {
                        if ($(this).text() !== $("select:last option:selected").text())
                            toAppend += '<option value="' + $(this).val() + '">' + $(this).text() + '</option>';
                    });
                    toAppend += '</select>';
                    toAppend += '<input type="text" name="' + selectedOption + '"><br>';
                }
                $(".append-select").append(toAppend);
                if ($('select:last > option').length > 1)
                        $("select").find('option[value=' + selectedOption + ']').remove();
            });

我尽量减少尽可能多的更改（仅编辑了3或4行）。

添加下拉值的新输入字段

1 个答案: