Использование jQuery для запуска html-события onclick - PullRequest
28 голосов
/ 07 января 2011
<input type="text" id="test_value" name="test_value" value="xyz" />
<input id="test_default" name="test_default" type="checkbox" onclick="with(this.form.elements['test_value']) { disabled = this.checked; if (this.checked) { value = ''; } else {if(value=='') {value=' '; value = '';}}};" />

Встроенный onclick генерируется cms, который я не могу контролировать.Я хочу выполнить $("#test_default").click(); с jQuery, но это не работает, потому что он не связан с менеджером событий jQuery.

Я пробовал варианты

$("#test_default").click(function (e) {
                    $(e.target).attr("onclick").apply(checkbox, [e]);
                    return false;
                }).click();

, но безпомогло.Пожалуйста, помогите.

Спасибо.

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

Ответы работают в небольшой демонстрационной версии, но не в реальной среде.Пожалуйста, посмотрите на http://jsfiddle.net/GtJjt/ Мне нужно, чтобы флажок был запущен программно.

Только странно $("#metadata_field_text_10190_default")[0].click(); правильно запускает событие.Кто-нибудь может объяснить это?

Ответы [ 4 ]

41 голосов
/ 07 января 2011

Позвоните непосредственно в DOM onclick ( см. Демо ):

$("#test_default")[0].onclick();

Или вообще без jQuery

document.getElementById("test_default").onclick();

Обновление:

Фактическая проблема связана с взаимодействием между .click() jQuery и встроенным кодом onclick. .click() в jQuery на самом деле делает две вещи: он первый запускает любые обработчики событий, , включая встроенный onclick код, , а затем вызывает флажок для проверки .

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

Как мы можем это исправить? Сначала мы проверяем флажок вручную, затем вызываем встроенный обработчик. К сожалению, мы не можем использовать jQuery .click() для вызова встроенного обработчика, потому что он снова снимает флажок (он также будет вызывать другие обработчики событий, связанные с jQuery, если вы добавите их в будущем, вы, вероятно, этого не захотите ). Поэтому мы используем собственный метод DOM, который я описал ранее, поскольку его единственный эффект - запуск встроенного кода.

Окончательный код:

$("#metadata_field_text_10190_default").attr("checked", true)[0].onclick();

См. Демонстрацию: http://jsfiddle.net/GtJjt/3/. (я включил console.log во встроенный код для демонстрации, чтобы доказать, что встроенный код работал. Удалите это, если ваш браузер не Firefox или Chrome, или он потерпит крах) .

Обновите снова :

Ранее я не видел твоего решения, Саймон, спасибо, что напомнил мне о [0].click(). По сути это нативный эквивалент для jQuery .click(), и он работает, потому что он делает то, что я описал выше (сначала проверяя флажок, а затем вызывая встроенный код). Предупреждение: это также вызовет любые обработчики событий, связанные с jQuery, что может быть не тем, что вы хотите.

2 голосов
/ 26 февраля 2014

Я использовал триггер в html с событием onclick следующим образом:

$("#test_default").trigger("onclick");
2 голосов
/ 07 января 2011

Только не return false, и вам позвонят:

$("#test_default").click(function (e) {
  //hi!
}).click();

Если вы хотите предотвратить действие по умолчанию, используйте вместо него e.peventDefault(), которое не уничтожит событие. Кроме того, что касается вашего встроенного обработчика onclick (почему бы не сделать это all ненавязчиво?), Я настоятельно рекомендую не использовать with.

0 голосов
/ 28 апреля 2016

Я использую следующий код:

$("your_selector")[0].click();

В вашем случае:

 $("#test_default")[0].click();
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...