Jquery onchange не работает

Почему мой jquery.on (‘change’) не работает для динамически добавляемых выборок

Я добавляю элементы select динамически, как в приведенном ниже HTML. Я не уверен, почему .on (‘change’. ) не работает для dynamic select. Что я упускаю?

Я использую Chrome 24.0.1312.57 + jquery 1.8.3.

9 ответов

присоединяет обработчик событий к select внутри элемента #x.

то, что вы хотите (из того, что я понял), — это что-то в строках:

это присоединяет обработчик событий к элементу #y, который делегируется его дочерним элементам «select»

The .метод on() присоединяет обработчики событий к выбранному набору элементы в объекте jQuery.

привязка событий к элементам, которые не находятся в DOM при начальной загрузке страницы, не будет работать. Вам нужно привязаться к элементу выше DOM, который существует, чтобы позволить событию просачиваться вниз. Это обычно подход, который я принимаю:

Я предпочитаю его, так как вы можете легко добавлять последующие события.

привязка события установлена на $(document).готовый.)( Однако, если вы динамически добавляете их позже (например, через jQuery.appendTo () или тому подобное), новые добавленные компоненты должны быть привязаны, поскольку они не были частью inital, который произошел в $(document).ready (), который запускается только один раз, когда страница загружена и DOM изначально выполнен.

такой синтаксис on() для динамического элемента, кажется:

весь смысл .on () — это то, что вы можете привязать событие к чему-то, кроме документа. Это то, что сейчас обесценилось .live() сделал, и в большинстве случаев он неэффективен. Вы должны привязать событие к ближайшему родительскому элементу, который не будет динамически изменен.

насколько мне известно, это правильный синтаксис:

Если #x или #y будут изменены, оберните их в элемент и привяжите к нему событие.

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

пример неправильного пути:

обратите внимание, что я уронил super parent: ‘#tablecontent’

Источник

onchange не работает

Я изучаю JavaScript в книге из серии Head First от O’Reilly media, и я только что добрался до главы, где мне нужно использовать событие onchange .

Я тестирую с использованием Safari / OS X Lion, Firefox, Chrome, Opera и IE / Windows, но получил тот же результат.

Учитывая этот код:

Правильно ли говорить, что событие onchange срабатывает всякий раз, когда мы меняем одно поле на другое, активируется ли оно только нажатием или клавишей TAB?

4 ответа

«Просто чтобы уточнить, событие onchange срабатывает всякий раз, когда мы меняем одно поле на другое, будь то путем нажатия или с помощью клавиши TAB, верно?»

Да — пока значение изменилось

Я не уверен, в чем вопрос — твой код работает! Я протестировал его на jsfiddle.net — отлично подходит для изучения / тестирования javascript.

(вы должны закрыть свой HTML-тег между прочим) .

Если элемент является элементом ввода и применяется событие изменения к элементу, и элемент не имеет определенной активации поведение, и пользователь изменил значение элемента или его список выбранные файлы, в то время как элемент управления был сфокусирован без фиксации изменить, а затем запустить простое событие, пузыри с именем change на элемент .

Запустите простое событие с именем blur в элементе.

Обратите внимание, что change может запускаться и в другое время. В спецификации также сказано:

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

И продолжает приводить пару примеров «совершения изменений»

Примером пользовательского интерфейса с действием фиксации может быть элемент управления «Загрузка файла», состоящий из одной кнопки, которая вызывает диалоговое окно выбора файла: если диалоговое окно закрыто, если этот выбор файла изменился в результате, то пользователь имеет совершил новый выбор файла.

Другим примером пользовательского интерфейса с действием фиксации может быть элемент управления Date, который позволяет вводить текстовые данные как пользователя, так и выбирать пользователя из раскрывающегося календаря: хотя при вводе текста может не быть явного шага фиксации, выбор даты из выпадающего списка вниз по календарю, а затем отклонение выпадающего списка будет совершением действия.

«Мы переключаемся с одного поля на другое, будь то путем нажатия или с помощью клавиши TAB» —

Событие, которое вы закодировали, срабатывает всякий раз, когда вы изменяете значение ввода, а затем покидаете поле. EG: введите что-то в поле, затем нажмите клавишу TAB.

Ваш пример кода работает, как и ожидалось для меня.

Поведение, которое вы описали, находится в фокусе. onchange выполняется при изменении значения ввода. Если вы введете что-то в поле, оно должно запуститься.

Источник

HTML и JQUERY onchange не работают

Здесь сервис просто заполнитель, он скажет сервер.

Кто-нибудь может увидеть проблему здесь? я пытаюсь получить его, поэтому, когда я выбираю выпадающую кнопку, соответствующее поле становится видимым, например,

Читайте также:  Почему не работает правый наушник редми аирдотс

Сервер 1 не виден

Вы выбираете сервер 1 из списка

Сервер 1 становится видимым

4 ответа

Вы вызываете целую логику в onchange , вы получили неправильные двойные кавычки (не уверен, но может вызывать проблему). Также document.getElementByid должен быть document.getElementById (см. I в заглавной для Id)

Вы должны написать отдельную функцию Javascript и вызывать ее при изменении события ввода.

Так что измените ниже линии

И добавьте функцию JavaScript, как показано ниже:

1. Синтаксис document.getElementById был неверным.
2. изменил кавычки вокруг ‘Service’ , так как это может привести к разрыву строки.

Попробуйте ниже код:

Там есть три основных вопроса:

Вы использовали «умные кавычки», которые недопустимы (как кавычки) в JavaScript или HTML. Вместо этого используйте прямой » .

Предполагая, что вы исправите # 1, у вас будет » в » , что приведет к преждевременному обрезанию вашего атрибута. Используйте ‘ последовательно внутри атрибута, чтобы избежать его (или используйте &quot , но это может быть трудно читать).

Капитализация имеет значение в JavaScript. Это getElementById , а не getElementByid .

Вот исправленная версия:

Я вижу две основные проблемы здесь:

1.getElementByid должен иметь Id (Caps I)

2. в списке ввода элемента нет идентификатора атрибута, но вы выбираете по Id Service

Пожалуйста, подумайте над написанием аккуратного кода.

Источник

Вызовите событие Javascript onchange, программно изменив значение текстового поля

Проблема, с которой я сталкиваюсь, заключается в следующем:

• У меня есть текстовое поле для диапазона дат вдоль элемента управления календаря.
• Когда пользователь выбирает дату из календаря, он заполняет эту дату в текстовом поле
• Когда это происходит, я хочу запустить функцию javascript, однако событие onchange, похоже, не происходит.

В идеале я хотел бы иметь возможность добавить событие в качестве атрибута в текстовое поле, что-то вроде:

Больше информации: дата вводится в текстовое поле в c #. Элемент управления календаря имеет обработчик событий на странице. Когда дата выбрана, обработчик событий помещает ее в текстовое поле. Я попытался установить фокус на текстовое поле на этом этапе, а затем поместить атрибут onBlur на текстовое поле, но текстовое поле, кажется, никогда не получает фокус.

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

8 ответов

Вы неверно истолковываете, что делает событие onchange при применении к текстовой области. Он не сработает, пока не потеряет фокус или вы не нажмете Enter. Почему бы не запустить функцию из onchange для выбора, который заполняет текстовую область?

Читайте также:  Как настроить управление fear

Узнайте больше о событии onchange: w3schools

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

Но почему бы не получить событие, когда пользователь нажимает на дату? Там уже должен быть какой-то JavaScript.

Источник

Как реализовать onChange, после чего с помощью jQuery?

имеет этот API. А как же ?

12 ответов:

однако это событие будет срабатывать только тогда, когда селектор потерял фокус, поэтому вам нужно будет щелкнуть в другом месте, чтобы выполнить эту работу.

Если это не совсем правильно для вас, вы могли бы использовать некоторые другие jQuery-события как keyup,keydown или нажатие — в зависимости от точного эффекта, который вы хотите.

как сказал @pimvdb в своем комментарии,

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

Это настолько полезно, что стоит поставить его в ответ. В настоящее время (v1.8*?) нет .вход() удобство fn в jquery, поэтому способ сделать это

Я бы предложил использовать событие keyup что-то вроде ниже:

обновление: это работает только для ручного ввода не копировать и вставлять.

для копирования и вставки я бы порекомендовал следующее:

это работает довольно хорошо, особенно в паре с jqGrid управление. Вы можете просто ввести в текстовое поле и тут просмотр результатов в вашем jqGrid .

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

причина, по которой это единственный способ, заключается в том, что существует несколько способов изменить поле ввода с помощью различных входов (клавиатура, мышь, вставка, история браузера, voiceinput и т. д.) и вы никогда не сможете обнаружить их все, используя стандартные события в кросс-браузерной среде.

к счастью, благодаря этому событию инфраструктура в jQuery, это достаточно легко добавить свои собственные события inputchange. Я сделал это здесь:

использовать его как: $(‘input’).on(‘inputchange’, function() < console.log(this.value) >);

если вы боитесь нескольких интервалов, вы можете связать / отменить это событие на focus / blur .

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

Источник