0

我在网页上有一个带有 data-id 和 value 的选择器

HTML

    <select id="s1">
        <option data-id="01">aaaa1</option>
        <option data-id="23">bbb1</option>
        <option data-id="451">ccc1</option>
        <option data-id="56">ddd1</option>

    </select>

<p></p>

JAVASCRIPT

$('#s1').change(function() { 
       var val = $(this).val();   
       var val_id =$(this).find('option').data('id');
       $("p").html("value = " + val + "<br>" +"value-data-id = "+  val_id);
});

我想从选定的选择器和他的数据 ID 中获得实际价值。我不明白为什么我只有第一个选项的数据 ID。这是我的代码http://jsfiddle.net/s55rR/ 请帮我找到一个错误。

4

3 回答 3

6

你可以做到$(this).find('option:selected').data('id')。

于 2013-10-25T18:38:54.473 回答
4

您选择了多个元素( $(this).find('option'))，但.data()如果在长度 >1 的 jQuery 上调用，则仅返回第一个元素的值：

描述： 返回 jQuery 集合中第一个元素的命名数据存储中的值，data(name, value)由 HTML5data-*属性设置或设置。

如果您只想要data-id来自 user-selected 的值<option>，那么您只需要选择该元素。

于 2013-10-25T18:38:03.077 回答
3

因为您选择了所有选项，并且 jQuery 返回.data('id')了第一个选项

var val_id =$(this).find('option:selected').data('id');

小提琴

于 2013-10-25T18:38:39.343 回答