jquery селектор на бритве не вызывает событие - PullRequest
0 голосов
/ 13 февраля 2020

Не могли бы вы предложить, если приведенный ниже код вызывает событие jquery onchange, будет ли оно работать?

<div id= "abc">
</div>

@Html.Partial("partial.cshtml")

Внутри частичного представления много вложенных элементов dom, и один из них -

<select id="xyz">
</select>

Я пытаюсь вызвать событие jquery onchange, но оно не работает

$( document ).ready(function() {
   $("#abc").find("#xyz").on("change",function(){
   alert("hi");
});
});

событие onchnage просто не запускается.

Ответы [ 2 ]

1 голос
/ 13 февраля 2020

функция .find () будет искать совпадающие дочерние элементы выбранного вами элемента, но на самом деле вы ищете элемент "родственного элемента", который является родственным элементом вашего элемента ab c. Одним из решений является то, что вы можете вызвать .siblings (), чтобы найти этот родственный элемент, а затем добавить прослушиватель событий для события onchange:

$('#abc').siblings('#xyz').on('change', function() {
    alert("Changes");
});
0 голосов
/ 13 февраля 2020

Структура HTML, которую вы демонстрируете, такова:

<div id="abc">
</div>
<select id="xyz">
</select>

Эти элементы являются братьями и сестрами, один не содержит другой. Но в коде jQuery вы ищете один элемент внутри другого:

$("#abc").find("#xyz")

Таким образом, последний никогда не найден, потому что он не содержится в первом. Однако, поскольку селектор использует id, вам не нужно сужать его до содержащего элемента. Вы можете просто выбрать на основе id:

$("#xyz").on("change",function(){
    alert("hi");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="abc">
</div>
<select id="xyz">
    <option value="0">0</option>
    <option value="1">1</option>
</select>
...