JQuery UI Multiselect如何获取选定的选项值答案

【问题标题】：JQuery UI Multiselect how to get selected options valuesJQuery UI Multiselect如何获取选定的选项值
【发布时间】：2012-02-03 16:57:20
【问题描述】：

在 Michael Aufreiter 搜索如何在 JQuery UI 小部件中获取选定选项值时浪费了我的时间。这是他的演示站点和 github 的链接：http://quasipartikel.at/multiselect/

因此，我只需要选定选项的值字段，而不需要将 POST/GET 发送到 PHP 脚本。我尝试了很多方法，但没有结果。需要您的帮助和想法

*发现很多关于jquery ui multiselect但是因为Aufreiter没用的话题：s *

【问题讨论】：

标签： jquery-ui multi-select

【解决方案1】：

应该可以。使用 Chrome 控制台测试

$("#countries").val();

【讨论】：

别忘了在你的选择标签中添加multiple="multiple"

【解决方案2】：

我访问了您上面列出的站点，并且能够在我的 chrome 控制台中运行它：

$('.ui-multiselect .selected li').each(function(idx,el){ console.log(el.title); });

您想要的值似乎存储在 div.selected 元素内列表项的标题属性中。

编辑：

哇！好吧，你当然想要这些值。不好意思，朋友。完全错过了。实物存储在jQuery data() 对象中。在这种情况下，您想要的键是“optionLink”。它维护对选项元素的引用。 '.selected' div 中的每个列表项都使用 jQuery.data() 方法为其添加基础选项。

所以，你需要获取选中的列表项，遍历，从数据jQuery数据存储中获取'optionLink'，然后获取值。

以下代码适用于示例页面：

$('.ui-multiselect .selected li').each(function(idx,el){
    console.log(el);
    var link = $(el).data('optionLink');
    // link now points to a jQuery wrapped <option> tag


    // I do a test on link first.  not sure why, but one of them was undefined.
    // however, I got all four values.  So I'm not sure what the first <li>
    // is.  I'm thinking it's the header...
    if(link){

        // here's your value. add it to an array, or whatever you need to do.
        console.log(link.val());
    }

});

这是我第一次看到多选。它很光滑。但我同情你试图把事情弄出来的挫败感。 'getSelectedOptions()' 方法会很好。

干杯

【讨论】：

我需要字段的值而不是它的名称（实际上是标题）clip2net.com/s/1swzK 有名称但没有值。而且我无法使用其文本搜索该字段的值，因为我放入多选小部件的数据正在从社交网络中取出，保存 1k 大量数据并不聪明，然后发布它们，然后按名称搜索值，然后给出结果给用户：s 仍然需要您的帮助大师，感谢您的发帖:)
好的。编辑帖子并添加代码以获取值。祝你好运！
太棒了！让我吻你，哈哈 :)) 非常感谢，我的例子可以在 russia-golosuet.ru/otkr/test.php
非常好。不要忘记“接受”我的回答！我正在努力建立我的观点。 :)
哦，是的，没注意到这个功能:)

【解决方案3】：

尝试访问关闭事件中的选定值。

例如

$("#dropdown").multiselect({
    header: false,
    selectedList : 1,
    height: "auto",
}).multiselectfilter().bind("multiselectclose", function(event, ui) {
    var value = $("#dropdown").val();
});

希望对您有所帮助。

【讨论】：

【解决方案4】：

最佳解决方案

$('#select').multiselect({
    selectAllValue: 'multiselect-all',
    enableCaseInsensitiveFiltering: true,
    enableFiltering: true,
    height: "auto",
    close: function() {
            debugger;
            var values = new Array();
            $(this).multiselect("getChecked").each(function(index, item) {

                values.push($(item).val());
            });
            $("input[id*=SelectedValues]").val(values.join(","));
    }
});

【讨论】：

【解决方案5】：

你可以试试这个：

$('#ListBoxId').multiselect({
    isOpen: true,
    keepOpen: true,
    filter: true
});

【讨论】：