Мне трудно понять, как имитировать щелчок мыши с помощью JQuery. Может кто-нибудь, пожалуйста, сообщите мне, что я делаю неправильно.
HTML:
<a id="bar" href="#" onclick="location.href='http://stackoverflow.com'; return false;" target="_blank">Don't click me!</a>
<span id="foo">Click me!</span>
JQuery:
jQuery('#foo').on('click', function(){
jQuery('#bar').trigger('click');
});
Демо: FIDDLE
когда я нажимаю на кнопку #foo, я хочу смоделировать щелчок на #bar, однако, когда я пытаюсь это сделать, ничего не происходит. Я также попробовал jQuery(document).ready(function(){...}) но безуспешно.
Вам нужно использовать jQuery('#bar')[0].click(); чтобы имитировать щелчок мышью на фактическом элементе DOM (не объект jQuery), вместо использования .trigger() метод jQuery.
Примечание. Уровень DOM уровня 2 .click() не работает над некоторыми элементами в Safari. Вам необходимо использовать обходной путь.
Вам просто нужно положить небольшое событие таймаута, прежде чем делать .click()
например:
setTimeout(function(){ $('#btn').click()}, 100);
Это поведение JQuery. Я не уверен, почему он работает таким образом, он только запускает функцию onClick в ссылке.
Try:
jQuery(document).ready(function() {
jQuery('#foo').on('click', function() {
jQuery('#bar')[0].click();
});
});
См. мою демонстрацию: http://jsfiddle.net/8AVau/1/
jQuery(document).ready(function(){
jQuery('#foo').on('click', function(){
jQuery('#bar').simulateClick('click');
});
});
jQuery.fn.simulateClick = function() {
return this.each(function() {
if('createEvent' in document) {
var doc = this.ownerDocument,
evt = doc.createEvent('MouseEvents');
evt.initMouseEvent('click', true, true, doc.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
this.dispatchEvent(evt);
} else {
this.click(); // IE Boss!
}
});
}
Может быть полезно:
Код, вызывающий триггер, должен идти после, вызываемое событием.
Например, у меня есть код, который я хочу выполнить, когда значение #expense_tickets изменяется, а также, когда страница перезагружается
$(function() {
$("#expense_tickets").change(function() {
// code that I want to be executed when #expense_tickets value is changed, and also, when page is reload
});
// now we trigger the change event
$("#expense_tickets").trigger("change");
})
jQuery .trigger('click'); приведет к тому, что событие будет запущено на этом событии, оно также не инициирует действие браузера по умолчанию.
Вы можете имитировать те же функции со следующим JavaScript:
jQuery('#foo').on('click', function(){
var bar = jQuery('#bar');
var href = bar.attr('href');
if(bar.attr("target") === "_blank")
{
window.open(href);
}else{
window.location = href;
}
});
Попробуйте это для меня:
$('#bar').mousedown();
jQuery('#foo').on('click', function(){
window.open(jQuery('#bar').attr('href'), '_blank');
});
Я пробовал два первых ответа, это не сработало для меня, пока я не удалял "display: none" из элементов ввода файла. Затем я вернулся к .trigger(), он также работал в Safari для окон.
Итак, заключение Не использовать display: none; чтобы скрыть ввод файла, вы можете использовать opacity: 0 вместо.
Технически это не ответ на этот вопрос, но хорошее использование принятого ответа (fooobar.com/questions/60510/...), чтобы создать кнопки next и prev для вкладок в полях ACF jQuery:
$('.next').click(function () {
$('#primary li.active').next().find('.acf-tab-button')[0].click();
});
$('.prev').click(function () {
$('#primary li.active').prev().find('.acf-tab-button')[0].click();
});
Вы не можете имитировать событие click с javascript.
Функция jQuery .trigger() запускает событие с именем "click" в элементе, которое вы можете захватить с помощью метода .on() jQuery.