Блог

Главная - Вопросы по программированию - Событие изменения не работает в этом сценарии

Событие изменения не работает в этом сценарии

#jquery

#jquery

Вопрос:

 <table>
<tr>
<td><input type='checkbox'><span>Text1</span><input type='text'></td>
</tr>
<tr>
<td><input type='checkbox'><span>Text2</span></td>
</tr>
<tr>
<td><input type='checkbox'><span>Text3</span></td>
</tr>
<tr>
<td><input type='radio'><span>None of all</span></td>
</tr>
</table>

Ниже приведен мой код jQuery.. 

 $(':checkbox').live('change',function()
            {
                $(':radio').prop('checked',!$(this).prop('checked'));
            });
$(':radio').live('change',function()
            {
                $(':checkbox').prop('checked',!$(this).prop('checked'));
            });

$('table :text').live('keyup', function() {
var um = $(this).closest('td').find('input');
if ($(this).val().length > 0) {
    um.prop('checked', true);
}
else {
    um.prop('checked', false);
}
});

Что будет делать приведенный выше код, так это 

  1. Checkboxes and Radio button are mutually exclusive
 2. On change of a textbox automatically the checkbox inside its parent will checked/unchecked.

Но

Меня беспокоит то, что когда я впервые нажимаю переключатель, то, если я изменяю текст в текстовом поле, флажок будет установлен, но переключатель останется непроверенным.. Почему это происходит.. Пожалуйста, помогите мне в этом..

Ответ №1:

Была такая же проблема с плагином автозаполнения, где выбор этого изменял текстовый элемент, но не вызывал событие изменения. Вы могли бы добавить

 um.trigger("change");

после вашего if / else

Комментарии:

1. но вы сказали, что либо флажок, либо переключатель установлены. не оба .. но вы выбираете переключатель и снимаете установленный флажок и видите результаты.

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

Ответ №2:

самый простой способ — запустить событие изменения при изменении состояния этого флажка:

 if ($(this).val().length > 0) {
    um.prop('checked', true);
}else{
    um.prop('checked', false);
}
um.change();

Ответ №3:

Вместо этого, если изменить, используйте щелчок 

 $(':checkbox').live('change',function()  {

надеюсь, у вас все будет хорошо