jquery借助attr获取select下option的自定义值失败

JavaScript / 2021年9月7日 / hamster

先看示例

<select id="web">
    <option value="1" data-url="aaa">1</option>
    <option value="2" data-url="bbb">2</option>
    <option value="3" data-url="ccc">3</option>
    <option value="4" data-url="ddd">4</option>
    <option value="5" data-url="eee">5</option>
    <option value="6" data-url="fff">6</option>
</select>

$("#web").change(function () {
    var name = $(this).val();
    var url = $(this).attr("data-url");
    alert(url);
});

按上述代码操作，可以获取value值，却无法获取data-url的值，提示undefined。

查找度娘后，找到解决方案

$("#web").change(function () {
    var url = $(this).find("option:selected").attr("data-url");
    alert(url);
});

问题解决。

至于原因，还不清楚。

Jquery