jquery $(事件目标).属性(“数据条”)未定义

wgx48brx  于 2023-03-07  发布在  jQuery
关注(0)|答案(1)|浏览(102)

jQuery在访问自定义数据属性时表现出一些非常奇怪的行为。
下面是HTML

<div id="foo2" data-bar="bar" class="baz">some text</div>

jQuery语言

$(document).ready(function() {

    $("#mainPage").on("click", "[id^='foo']", doSomething);

});
    

function doSomething(e) {
    var bar = $(e.target).attr("data-bar");
}

这样就得到bar = undefined
不过

function doSomething(e) {
        e.target
        var bar = $(e.target).attr("data-bar");
    }

得到bar = "bar"
我发现这非常奇怪。在Chrome调试控制台上,它清楚地显示数据集或目标持有bar: "bar",但没有e.target,它返回undefined。这是某种bug吗?

rqqzpn5f

rqqzpn5f1#

使用$(this)$(e.target)工作。您的foo div是否位于id为mainPage的元素中?

$(document).ready(function() {
  $("#mainPage").on("click", "[id^='foo']", doSomething);
});

function doSomething(e) {
  console.log($(e.target).attr("data-bar"));
  console.log($(this).attr('data-bar'));
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<body id='mainPage'>
  <div id="foo2" data-bar="bar" class="baz">some text</div>
</body>

相关问题