javascript - Magicsuggest 更改占位符文本

Question

我已经使用 Magicsuggest 工作了几天，我正在尝试更改占位符文本，以便 Magicsuggest 像单选一样。

我有第一个:

HTML

<div style="padding:5px 10px;" data-bind="visible: availableOptions().length > 1">
   <div id="magicsuggest"></div>
</div>

JavaScript

magicOChange = $('#magicsuggest').magicSuggest({
     data: availableOptions,
     placeholder: function () {
              $('.ms-sel-ctn input').attr("placeholder", SelectedN);
     }
});

$(magicOChange).on('selectionchange', function (e, m, sel) {
     if (sel.length == 0) return;
     for (i = 0; i < availableOptions.length; i++) {
          if (typeof sel[0] != 'undefined')
              if (availableOptions[i].name == sel[0].name) {
                       SelectedN(sel[0].name);
                       SelectedN2(sel[0].name);
                       break;
              }
     }
     if (typeof sel[0] != 'undefined') {
         magicOChange.collapse();
         this.clear();
     }
});

我正在尝试在弹出窗口中添加第二个:

HTML

<div class="modal-body">
    <div class="row">
         <div data-bind="visible: availableOptions().length > 1">
               <div id="magicsuggestM"></div>
         </div>
    </div>
</div>

JavaScript

magicMChange = $('#magicsuggestM').magicSuggest({
     data: availableOptions,
     placeholder: function () {
              $('.ms-sel-ctn input').attr("placeholder", SelectedN2);
     }
});

$(magicMChange).on('selectionchange', function (e, m, sel) {
     if (sel.length == 0) return;
     for (i = 0; i < availableOptions.length; i++) {
          if (typeof sel[0] != 'undefined')
              if (availableOptions[i].name == sel[0].name) {
                       SelectedN2(sel[0].name);
                       break;
              }
     }
     if (typeof sel[0] != 'undefined') {
         magicMChange.collapse();
         this.clear();
     }
});

但似乎当我尝试更改第二个 Magicsuggest(弹出窗口中的那个)的值时，它会更改另一个的占位符，而所需的占位符保持不变。有没有一种方法可以在不影响另一个占位符的情况下更改一个占位符的值？

Answer 1

它从第一个可用的 dom 元素中提取占位符。在占位符处，在查询选择器之前添加每个元素的 ID。所以，而不是:

$('.ms-sel-ctn input').attr("placeholder", SelectedN);

将其更改为:

$('#magicsuggestv .ms-sel-ctn input').attr("placeholder", SelectedN);

而不是:

$('.ms-sel-ctn input').attr("placeholder", SelectedN2);

将其更改为:

$('#magicsuggestM .ms-sel-ctn input').attr("placeholder", SelectedN2);