Выберите изменения, которые не срабатывают, если добавлены JQuery

Question

У меня есть многоуровневая цепочка выбора, где по значению первого выбора генерируются опции для следующего списка выбора.А во втором списке некоторые значения приведут к отображению div с другим входом.

Мои коды (ниже), кажется, прекрасно работают при тестировании на статическом контенте (то есть: второй выбор жестко закодирован вHTML).Но когда я добавляю его с помощью JQuery, второй уровень больше не вызывает функцию .change.

<script type="text/javascript">
$(document).ready(function() {
  $dts = $("select[name='tourdes']");
  $dts.change(function() { 
     var dtsValue = $(this).val();
     var dtsString = '?tourdes=' + dtsValue; 
     $('#dateSelect').show();
     $('#dateSelect').load('include/avdates.php' + dtsString).append();
  });
});
</script>

<script type="text/javascript">
$(document).ready(function() {
  $tags = $("select[name='tourcode']");
  $tags.change(function() {
     if ($(this).val() == "private") {
     $(".prvcal").css({"visibility":"visible"});
  }
  });
});
</script>

Я предполагаю, что что-то нужно повторно инициализировать, но я не получаю, где в моих экспериментах.

Answer 1

Если вы используете jQuery 1.7, вы захотите использовать on, так как live и delegate устарели.

$(document).on("change", "select[name='tourcode']", function() {
    var dtsValue = $(this).val();
    var dtsString = '?tourdes=' + dtsValue; 
    $('#dateSelect').show();
    $('#dateSelect').load('include/avdates.php' + dtsString).append();
});

документы для включения ()

Answer 2

Возможно, вы используете динамически генерируемые элементы HTML.Если это так, вам нужно использовать .delegate() для их обработки:

$('select').delegate("[name='tourdes']", 'change', function() {