如何使用 jQuery 访问数据属性的值

Question

我想访问 jQuery 中的数据属性。但每次我尝试访问它时，它 returns 未定义。

代码是

<select name="start" id="source">
    <option selected disabled>Select your location</option>
    <option data-lat="74.1833" value="some for php">Gujranwala</option>
    <option data-lat="74.3436" value="some for php">Lahore</option>
    <option data-lat="74.536" value="some for php">sialkot</option>
    <option data-lat="74.0789" value="some for php">gujrat</option>
    <option data-lat="67.0100" value="some for php">Karachi</option>
  </select>

我尝试使用

$('#source').attr('data-lat');

当用户 select 一个选项时，它应该给出自定义属性值。但它不起作用.. 仍然未定义。谁能告诉我任何替代解决方案，或者如果我在这个问题上有误，请更正...

请尝试提交运行示例.. 提前致谢。

如果我在解释问题时做错了什么，请忽略它，我希望你们明白我想说的..:)

Answer 1

您需要针对设置了自定义属性的所选选项。顺便说一下，你可以使用 data() 函数。

$('#source option:selected').data('lat');

如何使用 jQuery 访问数据属性的值

How to access the value of a data attribute using jQuery

jquery

custom-attributes