Question

这源于my original question。我正在扩展它。

Html选择选项

    <select id="1d" name="camp" multiple="multiple">
    <option data-url0="week_1" value="Week 1">30th July</option>
    <option data-url1="week_2" value="Week 2">6th August</option>
    </select>
    <input type="hidden" name="camp_url0" id="1e">
    <input type="hidden" name="camp_url1" id="1f">

Jquery脚本我正在努力。

    $("#1d").on("change", function () {
    var url1 = $(this).children(":selected").data("url0");
    var url2 = $(this).children(":selected").data("url1");
    $("#1e").val(url0);
    $("#1f").val(url1);
});

除了一个重要问题外，这段代码工作得很漂亮（可能不是最干净的？）。即使它是多选择器，只要选择了两个选项，DOM中只有一个option被标记为:selected，这意味着只输入了一个data-url{row_id}。如果两者都被选中，我需要两者。

我希望这是有道理的。谢谢你的帮助。

Answer 1

<强> UPD ：

将一些额外的“路由”数据添加到html

<select id="1d" name="camp" size="5" multiple>
    <option data-url="week_1" data-id="1e" value="Week 1">30th July</option>
    <option data-url="week_2" data-id="1f" value="Week 2">6th August</option>
</select>

并使用它

$("#1d").on("change", function () {
    $('input[type=hidden]').val('');

    $('option:selected', this).each(function() {
        $('#' + $(this).data('id')).val($(this).data('url'))
    })
})

http://jsfiddle.net/5ctDC/1/

<强> OLD ：

只需.map它就会得到一个包含数据的数组。

$('option:selected', this).map(function() {
    return $(this).data('url')
})

["week_1", "week_2"]

http://jsfiddle.net/5ctDC/

Answer 2

浏览所选元素的所有：

$("#1d").on("change", function () {
    var allurl1 = '', allurl2 = '';
    $(this).children(":selected").each(function(){
        allurl1 += $(this).data("url0");
        allurl2 += $(this).data("url1");
    });
    $("#1e").val(allurl1);
    $("#1f").val(allurl2);
});

工作演示：http://jsfiddle.net/maniator/mtAgS/（我显示了输入，以便您可以直观地看到会发生什么）

Answer 3

在不相关的注释中，您不应该使用不以字母开头的id。

Jquery - 在Jquery中获取多个选择的数据

3 个答案: