Question

好的，例如我在select中声明了一个自定义值，例如

<select id="something">
    <option value="1" data="01"></option>
    <option value="2" data="02"></option>
    <option value="3" data="03"></option>
    <option value="4" data="04"></option>
</select>

出于某种原因，我不能在此处使用value属性。我需要使用data属性来提取值。我尝试使用jquery如下：

var dataString = {
    clicks: $("#clicks").val($(this).find(':selected').attr('data'))
};

但这并没有按预期返回结果。在控制台中显示too much recursion。我没有得到data属性的值（01,02,03等）。请帮忙。

Answer 1

我建议你使用data-*前缀属性，可以使用.data()

访问

＆＃13;

console.log($("#something option:selected").data("value"))

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="something">
        <option value="1" data-value="01"></option>
        <option value="2" data-value="02"></option>
        <option value="3" data-value="03"></option>
        <option value="4" data-value="04"></option>
    </select>

＆＃13;

Answer 2

试试此代码

 <select id="selectNo">
           <option value="1" data-no="01">1</option>
           <option value="2" data-no="02">2</option>
           <option value="3" data-no="03">3</option>
           <option value="4" data-no="04">4</option>
        </select>

和Jquery

  $("#selectNo").change(function () {
         alert($(this).find(':selected').data("no"));
    });

Output

Answer 3

我认为this是您的下拉列表。请尝试以下方法：

$("#clicks").val($(this).find('option:selected').attr('data'));

Answer 4

＆＃13;

$('#something').change(function(e)	{
    //var id = $(this).val();
  $('#something :selected').each(function(){
        var value = $(this).data('id');
        
        alert(value); 
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="something">
    <option value="1" data-id="01"></option>
    <option value="2" data-id="02"></option>
    <option value="3" data-id="03"></option>
    <option value="4" data-id="04"></option>
</select>

＆＃13;

Answer 5

尝试使用如下。

var option = $("#something option:selected").attr("data-value");

<强>经验：

 $("#something").change(function () {
  console.log($("#something option:selected").attr("data-value")) 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="something">
        <option value="1" data-value="01">01</option>
        <option value="2" data-value="02">02</option>
        <option value="3" data-value="03">03</option>
        <option value="4" data-value="04">04</option>
</select>

jQuery在<option>字段中提取自定义属性的值

5 个答案: