#html #jquery
#HTML #jquery
Вопрос:
У меня есть эта html-структура:
lt;table id="table"gt; lt;tr data-id="3"gt; lt;tdgt;08.09.2021lt;/tdgt; lt;tdgt;lt;div class="btnDelete"gt;Deletelt;/divgt;lt;/tdgt; lt;/trgt; lt;/tablegt; и эта функция onclick:
var myID = 3; $(".btnDelete").click(function() { console.log( $('#table').parents('tr').find("[data-id='" myID "']").html() ) }) Результат будет «неопределенным».
var myID = 3; $(".btnDelete").click(function() { console.log( $('#table').parents('tr').find("[data-id='" myID "']").html() ) }) lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"gt;lt;/scriptgt; lt;table id="table"gt; lt;tr data-id="3"gt; lt;tdgt;08.09.2021lt;/tdgt; lt;tdgt;lt;div class="btnDelete"gt;Deletelt;/divgt;lt;/tdgt; lt;/trgt; lt;/tablegt; Я хотел бы получить html-часть lt;tr data-id="3"gt; и выполнить поиск этого элемента по атрибуту данных «data-id». Но мой способ не работает.
В чем моя ошибка?
Комментарии:
1.
parents()идет вверх по ДОМУ, а не вниз. Просто удалите этот метод:$('#table').find("[data-id='" exportID "']").html()2. Всегда отлаживайте свои селекторы — кажется, что 90% (анекдотических) случаев, когда люди задают такой вопрос, как .html (), не работает , и у них просто неправильный селектор(ы).
console.log($("#table").length, $('#table').parents('tr').length, $('#table').parents('tr').find("[data-id='" myID "']").length)очень быстро сказал бы вам, в чем ваша проблема (предполагая, что у вас нет вложенной таблицы, но тогда вы не знали бы, что у вас была ошибка, так как она все еще «работает»)
Ответ №1:
Вот в чем ваша ошибка:
$('#table').parents('tr').find("[data-id='" myID "']").html() Это должно быть:
$('#table').find("[data-id='" myID "']").html() Ответ №2:
Элемент с идентификатором table не имеет никаких предков (функция parents ищет предков, а не только родителей), которые являются tr элементами в предоставленном вами HTML.
Избавьтесь от этого пункта.