HTML / JavaScript / JQuery Document.onChange для скрытого элемента не работает

Question

Я запрограммировал поле выбора для клиента, который узнает, что он переписан сторонней функцией javascript в кучу элементов div и span, а затем, наконец, скрытый элемент, который содержит выбранное значение из выбора div /.элемент spanЕсть еще одно поле выбора, которое я запрограммировал прямо под этим полем выбора, которое зависит от значения первого поля выбора (т. Е. Пользователь выбирает страну, а затем, если в стране есть регионы, такие как США и Канада, появляется окно выбора штата).,В любом случае, я подумал, что было бы лучше просто добавить событие onChange во вновь созданный скрытый элемент из первого поля выбора, а затем написать свою собственную функцию javascript, которая будет показывать / скрывать второе поле выбора на основе значения скрытых элементов, когдаэто изменилось в результате выбора страны (сторонний javascript уже обновляет значение скрытого элемента новым значением выбранной страны).Я пытался сделать это в JQuery и просто Java API JavaScript, однако, похоже, ничего не работает.Просто к сведению, когда сторонний javascript переписывает мой блок выбора в div / span и скрытое поле ввода, скрытое поле ввода не имеет атрибута id, поэтому я ссылаюсь на элемент через его имя ("collect_data [7] [0]«).Вот код, который я пробовал до сих пор ....

<script type="text/javascript">
 jQuery(document).ready(function(){
    jQuery("input-country").change(function(e){
        console.log("testA");
    });
})
jQuery("input-country").change(function(e){
    console.log("testB");
});
jQuery(document).ready(function(){
    jQuery(document.forms['myForm']['collected_data[7][0]']).change(function(e){
        console.log("testC");
    });
})
jQuery(document.forms['myForm']['collected_data[7][0]']).change(function(e){
    console.log("testD");
});
document.forms['myForm']['collected_data[7][0]'].onchange = function(){
    console.log("testE");
};
document.getElementById('input-country').onchange = function(){
    console.log("testF");
}
jQuery(document.forms['myForm']['collected_data[7][0]']).live('change',function(){
    console.log("testG " + jQuery(this).val()) 
});
jQuery('input-country').live('change',function(){
     console.log("testH " + jQuery(this).val())
});
 jQuery(document).ready(function(){
   jQuery(document.forms['myForm']['collected_data[7][0]']).live('change',function(){
        console.log("testI " + jQuery(this).val())
   });
})
jQuery(document).ready(function(){
   jQuery('input-country').live('change',function(){
        console.log("testJ " + jQuery(this).val())
    });
})
</script>

Answer 1

Вы не получите «изменения» событий, когда скрытый элемент изменяется программным образом чьим-то JavaScript-кодом.Они генерируются браузером только при действии действий пользователя.Лучше было бы, чтобы сторонний JavaScript явно вызывал «.change ()» (метод jQuery) для скрытого выбора.

Скрытый элемент явно никогда не станет целью для пользователявзаимодействие.

Answer 2

'input-country' не является допустимым селектором. Кроме того, событие изменения требует усиления фокуса, изменения значения, потери фокуса (размытия) - скрытые входы не будут иметь такой последовательности событий, поэтому при изменении их значений вы должны вручную инициировать их изменение.