Fiddle

我想要的是在选择项目时不选择项目。

实施例。

单击添加按钮，然后选择全名。
再次点击添加。
不应在第二个<select>中选择全名，或者不应显示全名。

我怎么能这样做？

HTML

<button>Add</button><br/><br/>
<div id="container"></div>

JS

var saveAsOptions = [
        { value: 'full-name', text: 'Full Name' },
        { value: 'first-name', text: 'First Name' },
        { value: 'last-name', text: 'Last Name' }
];

var i = 1;
var $selectSaveAs;

$('button').on('click', function(){

    $('#container').append(generateSaveAs(i));

    $selectSaveAs = $('#saveAs' + i).selectize({
       options: saveAsOptions, 
       placeholder: '- Fields -'
    });

    i++;
});

function generateSaveAs(id){
    return '<select id="saveAs' + id + '"></select>';
}

Answer 1

因此，每次创建新的下拉列表时，都会插入静态值。通过分析代码，我看到所选值总是有一个类项。所以我们可以做的是创建一个新的数组以显示下拉列表并过滤掉已经选择的数组。然后我们可以将它绑定在下拉列表中。

要过滤掉，您可以使用filter

saveAsOptionsFiltered = saveAsOptions; //Initialize with your all drop down options
$(".item").each(function(index,element) {
    /*Filter out the already selected ones*/
    saveAsOptionsFiltered = saveAsOptionsFiltered.filter(function (savevalue) {return savevalue.text !== $(element).text() }); 
});

JSFiddle

当选择了所有条件并且您停止添加更多内容时，我没有处理该条件我刚刚共享了您可以过滤掉所选代码的代码。

多个<select>使用选择，选择已删除时选项</select>

Fiddle

1 个答案: