Frage

Ich habe ein Problem mit einem Anker Klick über jQuery fälschen: Warum wird mein thickbox zum ersten Mal erscheint ich auf dem Eingabeknopf klicken, aber nicht das zweite oder drittes Mal?

Hier ist mein Code:

<input onclick="$('#thickboxId').click();" type="button" value="Click me" />

<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>

Es funktioniert immer, wenn ich direkt auf dem Link klicken, aber nicht, wenn ich versuche, die thickbox über die Eingabe-Taste zu aktivieren. Dies ist in FF. Für Chrome scheint es jedes Mal zu arbeiten. Irgendwelche Hinweise?

War es hilfreich?

Lösung

Versuchen Sie, Ihre jQuery ruft wie das zu vermeiden inlining. Setzen Sie einen Skript-Tag an der Spitze der Seite, auf das click Ereignis zu binden:

<script type="text/javascript">
$(function(){
    $('#thickboxButton').click(function(){
        $('#thickboxId').click();
    });
});
</script>

<input id="thickboxButton" type="button" value="Click me">
<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>

Edit:

Wenn Sie versuchen, einen Benutzer physisch auf den Link klicken, um zu simulieren, dann glaube ich nicht, dass möglich ist. Eine Abhilfe wäre die Schaltfläche der click Ereignis zu aktualisieren, um die window.location in Javascript zu ändern:

<script type="text/javascript">
$(function(){
    $('#thickboxButton').click(function(){
        window.location = $('#thickboxId').attr('href');
    });
});
</script>

Edit 2:

Nun, da ich merke, dass Thickbox ist ein benutzerdefinierter jQuery UI-Widget, fand ich die Anweisungen hier :

Anleitung:

  • Erstellen Sie ein Verbindungselement (<a href>)
  • Geben Sie den Link, um eine Klasse Attribut mit einem Wert von thickbox (class="thickbox")
  • Im href Attribut des Links fügen Sie den folgenden Anker: #TB_inline
  • Im href Attribute nach dem #TB_inline dem folgenden Abfrage-String hinzufügen, auf den Anker:

    ? Height = 300 & width = 300 & inlineId = myOnPageContent

  • ändern Sie die Werte der Höhe, Breite und inlineId in der Abfrage entsprechend (inlineID ist der ID-Wert des Elements, das den Inhalt enthält, die Sie in einem ThickBox zeigen möchten.

  • Optional können Sie modal = true in die Query-String hinzufügen (z #TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true), so dass ein ThickBox Schließen erfordert die tb_remove() Funktion innerhalb des ThickBox aufrufen. Sehen Sie die versteckten Modalgehalt Beispiel, wo Sie müssen auf Ja oder Nein die ThickBox zu schließen.

Andere Tipps

Was für mich gearbeitet wurde:

$('a.mylink')[0].click()

Ich habe vor kurzem gefunden, wie Mausklickereignis über jQuery auslösen.

    <script type="text/javascript">
    var a = $('.path > .to > .element > a')[0];
    var e = document.createEvent('MouseEvents');
    e.initEvent( 'click', true, true );
    a.dispatchEvent(e);
    </script>

Dieser Ansatz funktioniert auf Firefox, Chrome und IE. hoffe, es hilft jemand:

var comp = document.getElementById('yourCompId');
try { //in firefox
    comp.click();
    return;
} catch(ex) {}
try { // in chrome
    if(document.createEvent) {
        var e = document.createEvent('MouseEvents');
        e.initEvent( 'click', true, true );
        comp.dispatchEvent(e);
        return;
    }
} catch(ex) {}
try { // in IE
    if(document.createEventObject) {
         var evObj = document.createEventObject();
         comp.fireEvent("onclick", evObj);
         return;
    }
} catch(ex) {}

Obwohl diese sehr alte Frage fand ich etwas einfacher, diese Aufgabe zu bewältigen. Es ist jQuery-Plugin von jQuery UI-Team genannt Simulieren entwickelt. Sie können es nach jquery umfassen und dann können Sie so etwas wie

tun
<a href="http://stackoverflow.com/"></a>
$('a').simulate('click');

funktioniert in Chrome, Firefox, Oper und IE10.you können es herunterladen von https://github.com/eduardolundgren/jquery-simulate/blob/master/jquery.simulate.js

Die Frage Titel sagt: „Wie kann ich einen Anker klicken in jQuery simulieren?“. Nun können Sie den "Trigger" oder "triggerHandler" Methoden verwenden, etwa so:

<script type="text/javascript" src="path/to/jquery.js"></script>
<script type="text/javascript" src="path/to/thickbox.js"></script>
<script type="text/javascript">
$(function() {
    $('#btn').click(function() {
        $('#thickboxId').triggerHandler('click');
    })
})
</script>
...
<input id="btn" type="button" value="Click me">
<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>

Nicht getestet, das eigentliche Skript, aber ich habe verwendet trigger et al vor, und sie arbeiteten A'ight.

UPDATE
triggerHandler nicht wirklich tun, was der OP will. Ich denke, 1.421.968 bietet die beste Antwort auf diese Frage.

Ich würde vorschlagen, an dem Selen-API, um zu sehen, wie sie einen Klick auf einem Element in einem Browser-kompatible Weise auslösen:

Achten Sie auf die BrowserBot.prototype.triggerMouseEvent Funktion.

Ich glaube, Sie verwenden können:

$('#yourLink').bind('click', function() {
  //Do something over here
});

$('#yourLink').trigger('click');

Dies wird die Klick-Funktion leicht auslösen, ohne es tatsächlich zu klicken.

Müssen Sie fälschen einen Anker klicken? Vom thickbox Website:

  

ThickBox kann aus einem Verbindungselement, Eingangselement aufgerufen werden (typischerweise eine Taste) und das Flächenelement (Image-Maps).

Wenn das akzeptabel ist, sollte es so einfach sein wie die thickbox Klasse am Eingang setzen sich:

<input id="thickboxButton" type="button" class="thickbox" value="Click me">

Wenn nicht, würde ich empfehlen Firebug und einen Haltepunkt in der Methode OnClick des Ankerelementes platzieren, um zu sehen, wenn sie nur auf dem ersten Klick ausgelöst wird.

Edit:

Okay, hatte ich es für mich, um zu versuchen und für mich so ziemlich genau den Code in beiden Chrome und Firefox gearbeitet:

<html>
<head>
<link rel="stylesheet" href="thickbox.css" type="text/css" media="screen" />
</head>
<body>
<script src="jquery-latest.pack.js" type="text/javascript"></script>
<script src="thickbox.js" type="text/javascript"></script>
<input onclick="$('#thickboxId').click();" type="button" value="Click me">
<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>
</body>
</html>

Die Fenster Pop-ups, egal, ob ich den Eingang oder das Ankerelement klicken. Wenn der obige Code für Sie arbeitet, schlage ich Ihre Fehler an anderer Stelle liegt und dass Sie versuchen, das Problem zu isolieren.

Ein weiterer möglicherweise ist, dass wir verschiedene Versionen von jquery / thickbox verwenden. Ich verwende, was ich von der thickbox Seite bekam -. Jquery 1.3.2 und thickbox 3.1

Sie können ein Formular über jQuery oder in der HTML-Seite Code mit einer Aktion erstellen, die Ihre link href nachahmt:

<a id="anchor_link" href="somepath.php">click here</a>.

var link = $('#anchor_link').attr('href');
$('body').append('<form id="new_form" action="'+link+'"></form>');
$('#new_form').submit();

Um einen Klick auf einem Anker zu simulieren, während auf einer Seite landen, ich jQuery nur verwendet, um die scrollTop Eigenschaft in $(document).ready. keine Notwendigkeit für einen komplexen Trigger zu animieren, und das funktioniert auf IE 6 und jeden anderen Browser.

Wenn Sie nicht brauchen, JQuery zu verwenden, da ich nicht tun. Ich habe Probleme mit dem Cross-Browser-func von .click() hatte. Also ich benutze:

eval(document.getElementById('someid').href)

In Javascript Sie können wie folgt tun

function submitRequest(buttonId) {
    if (document.getElementById(buttonId) == null
            || document.getElementById(buttonId) == undefined) {
        return;
    }
    if (document.getElementById(buttonId).dispatchEvent) {
        var e = document.createEvent("MouseEvents");
        e.initEvent("click", true, true);
        document.getElementById(buttonId).dispatchEvent(e);
    } else {
        document.getElementById(buttonId).click();
    }
}

und Sie können es verwenden, wie

submitRequest("target-element-id");

Mit Jure Drehbuch ich dies gemacht, um einfach „Klick“ so viele Elemente wie Sie wollen.
Früher habe ich es einfach Google Reader auf 1600+ Artikel und es funktionierte perfekt (in Firefox)!

var e = document.createEvent('MouseEvents');
e.initEvent( 'click', true, true );
$(selector).each(function(){this.dispatchEvent(e);});

JQuery('#left').triggerHandler('click'); funktioniert in Firefox und IE7 in Ordnung. Ich habe es nicht auf anderen Browsern getestet.

Wenn Sie wollen, automatische Benutzer klickt auslösen wie folgt vor:

window.setInterval(function() 
    {
        $('#left').triggerHandler('click');
    }, 1000);

Das funktioniert nicht auf Android nativen Browser "verstecktes Eingang (Datei) Element" klicken:

$('a#swaswararedirectlink')[0].click();

Aber das funktioniert:

$("#input-file").show();
$("#input-file")[0].click();
$("#input-file").hide();

Bei dem Versuch, einen ‚Klick‘ in Unit-Tests mit den jQuery UI Spinnern zu simulieren ich keine der vorherigen Antworten bekommen konnte zu arbeiten. Insbesondere war ich versucht, den ‚Spin‘ des Auswählens den Pfeil nach unten zu simulieren. Ich schaute auf die jQuery UI spinner Unit-Tests und sie verwenden Sie die folgende Methode, die für mich gearbeitet:

element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup();
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top