JQuery 更改 select 时未定义数据属性

Question

我尝试使用此模式在 select 中动态创建选项并设置 jQuery 对象的数据，但无法正常工作。

这是我的 HTML 打印店选项代码，并给它一个 data-attribute 名称 "data-last-sync-shop"

<select id="shopSelect" 
        onchange="$('#lastSync').text($(this).data('lastSyncShop'));" 
        name="shop_select">

    <option value=""></option>

    <?php foreach ($shops as $code => $info) { ?>
        <option value="<?= $code ?>" 
                data-last-sync-shop="<?= $info['last_sync'] ?>">
            <?= $info['description'] ?>
        </option>
    <?php } ?>
</select>
<span id="lastSync">-</span>

如果我调试 select 的 onchange 事件，数据属性是 undefined 但如果我检查 HTML 生成的代码PHP 选项的数据属性已正确填充。为什么？我哪里错了？感谢您的回答。

我在此处添加 console.log()：

<select id="shopSelect" 
        onchange="console.log($(this).data('lastSyncShop'));" <!-- undefined --> 
        name="filtro[codice_shop_select]">

Answer 1

您需要定位 :selected option 元素。

 $(this).find('option:selected').data('lastSyncShop')

JQuery 更改 select 时未定义数据属性

JQuery data-attribute is undefined on change of a select

javascript

php

jquery

drop-down-menu

custom-data-attribute