$(event.target).attr("панель данных") не определена

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");
}

Это дает бар = неопределенный

тем не мение

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

дает бар = "бар"

Я нахожу это совершенно странным. На консоли отладки Chrome он четко показывает набор данных или целевое удержание bar: "bar"но без e.target это возвращается undefined, Это какая-то ошибка?

1 ответ

С помощью $(this) или же $(e.target) Работа. Ваш foo div находится внутри элемента с идентификатором 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>

Другие вопросы по тегам