Es fällt mir schwer zu verstehen, wie man einen Mausklick mit JQuery simuliert. Kann mir bitte jemand mitteilen, was ich falsch mache.
HTML:
<a id="bar" href="http://stackoverflow.com" target="_blank">Don't click me!</a>
<span id="foo">Click me!</span>
jQuery:
jQuery('#foo').on('click', function(){
jQuery('#bar').trigger('click');
});
Demo: [~ # ~] Geige [~ # ~]
wenn ich auf die Schaltfläche #foo klicke, möchte ich einen Klick auf #bar simulieren. Wenn ich dies versuche, passiert jedoch nichts. Ich habe auch jQuery(document).ready(function(){...})
ausprobiert, aber ohne Erfolg.
Sie müssen jQuery('#bar')[0].click();
m einen Mausklick auf das eigentliche DOM-Element zu simulieren (nicht das jQuery-Objekt) verwenden, anstatt die .trigger()
jQuery-Methode zu verwenden.
Hinweis: DOM Level 2 .click()
funktioniert nicht mit einige Elemente in Safari . Sie müssen eine Problemumgehung verwenden.
Sie müssen nur ein kleines Timeout-Ereignis einfügen, bevor Sie .click()
wie folgt ausführen:
setTimeout(function(){ $('#btn').click()}, 100);
Dies ist das JQuery-Verhalten. Ich bin mir nicht sicher, warum es so funktioniert. Es löst nur die onClick-Funktion für den Link aus.
Versuchen:
jQuery(document).ready(function() {
jQuery('#foo').on('click', function() {
jQuery('#bar')[0].click();
});
});
Siehe meine Demo: 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!
}
});
}
Könnte nützlich sein:
Der Code, der den Trigger aufruft, sollte gehen nach das Ereignis wird aufgerufen.
Ich habe beispielsweise Code, der ausgeführt werden soll, wenn der Wert für #expense_tickets geändert wird, und auch, wenn die Seite neu geladen wird
$(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");
})
jQueries .trigger('click');
löst nur ein Ereignis für dieses Ereignis aus, nicht jedoch die Standard-Browseraktion.
Sie können dieselbe Funktionalität mit folgendem JavaScript simulieren:
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;
}
});
Probieren Sie das aus, das bei mir funktioniert:
$('#bar').mousedown();
Technisch gesehen keine Antwort auf diese Frage, aber eine gute Verwendung der akzeptierten Antwort ( https://stackoverflow.com/a/20928975/82028 ), um Schaltflächen für die Registerkarten in jQuery ACF-Feldern zu erstellen :
$('.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();
});
Ich habe die ersten beiden Antworten ausprobiert, es hat bei mir nicht funktioniert, bis ich "display: none" aus meinen Dateieingabeelementen entfernt habe. Dann kehrte ich zu .trigger () zurück und es funktionierte auch bei Safari für Windows.
Fazit: Verwenden Sie nicht display: none; um Ihre Dateieingabe zu verbergen, können Sie stattdessen opacity: 0 verwenden.