javascript - 动态 "noneSelectedText"用于多选 jquery 框

Question

我正在尝试为页面的多选复选框部分获取动态字段 - 特别是 noneSelectedText。这是 HTML:

<select name="set_town[]" class="my_select set_town" multiple="multiple" data-selected-text="Select Town">

我找到了jQuery UI MultiSelect Widget - noneSelectedText for more than one select tag ，但我无法使包含的代码示例正常工作。我使用了 .data() 和 .attr() 无济于事。以下内容有效，但“选择城镇”内容不是动态的，并且我有几个复选框字段需要填充(全部不同)。

   $('select[multiple="multiple"]').multiselect({
    noneSelectedText: 'Select Town',
    header:  false,
    selectedText: function(numChecked, numTotal, checkedItems){
       return numChecked + ' of ' + numTotal + ' checked';
       }

不过，字段并不多，所以如果我能正确设置条件，我愿意对这些值进行硬编码，但我认为我的语法也有问题......

   $('select[multiple="multiple"]').multiselect({
    if ( $(".set_town" ) ) {
       noneSelectedText: 'Select Town',
    }
    header:  false,
    selectedText: function(numChecked, numTotal, checkedItems){
       return numChecked + ' of ' + numTotal + ' checked';
       }

Answer 1

您可以使用 $.each() 迭代 jQuery 选择并获取每个元素的数据属性:

$('select[multiple="multiple"]').each(function() {
    var select = $(this);
    select.multiselect({
        noneSelectedText: select.data('selected-text'),
        header:  false,
        selectedText: function(numChecked, numTotal, checkedItems) {
           return numChecked + ' of ' + numTotal + ' checked';
        }
    });
});