Jak zasymulować kliknięcie kotwicy za pomocą jQuery?

Mam problem z fałszowaniem kliknięcia kotwicy przez jQuery: Dlaczego mój gruby boks pojawia się po pierwszym kliknięciu przycisku wejściowego, a nie za drugim lub trzecim?

Oto mój kod:

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

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

Działa zawsze, gdy klikam bezpośrednio w link, ale nie, jeśli próbuję aktywować grube okno za pomocą przycisku wprowadzania. To jest w FF. W przypadku Chrome wydaje się, że działa za każdym razem. Jakieś wskazówki?

Staraj się unikać wstawiania wywołań jQuery w ten sposób. Umieść tag skryptu u góry strony, aby powiązać ze clickzdarzeniem:

<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>

Edytować:

Jeśli próbujesz zasymulować użytkownika fizycznego klikającego łącze, to nie sądzę, aby było to możliwe. Rozwiązaniem byłoby zaktualizowanie clickzdarzenia przycisku, aby zmienić window.locationkod JavaScript:

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

Edycja 2:

Teraz, gdy zdałem sobie sprawę, że Thickbox to niestandardowy widżet interfejsu użytkownika jQuery, instrukcje znalazłem tutaj :

Instrukcje:

• Utwórz element odsyłacza ( <a href>)

• Nadaj linkowi atrybut klasy o wartości Thickbox ( class="thickbox")

• W hrefatrybucie linku dodaj następującą kotwicę:#TB_inline

• W hrefatrybucie po #TB_inlinedodaniu następującego ciągu zapytania do kotwicy:

  ? height = 300 & width = 300 & inlineId = myOnPageContent

• Zmień odpowiednio wartości height, width i inlineId w zapytaniu (inlineID to wartość identyfikatora elementu zawierającego treść, którą chcesz wyświetlić w ThickBox.

• Opcjonalnie możesz dodać modal = true do ciągu zapytania (np. #TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true), Aby zamknięcie ThickBox wymagało wywołania tb_remove()funkcji z poziomu ThickBox. Zobacz przykład ukrytej zawartości modalnej, w którym należy kliknąć tak lub nie, aby zamknąć ThickBox.

U mnie zadziałało:

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

Niedawno odkryłem, jak wyzwalać zdarzenie kliknięcia myszą za pośrednictwem jQuery.

    <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>

to podejście działa w przeglądarkach Firefox, Chrome i IE. mam nadzieję, że to komuś pomoże:

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) {}

Chociaż jest to bardzo stare pytanie, znalazłem coś łatwiejszego do wykonania tego zadania. Jest to wtyczka jquery stworzona przez zespół jquery UI o nazwie simulate. możesz dołączyć go po jquery, a następnie możesz zrobić coś takiego

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

działa dobrze w chrome, firefox, opera i IE10. możesz go pobrać z https://github.com/eduardolundgren/jquery-simulate/blob/master/jquery.simulate.js

Tytuł pytania brzmi „Jak zasymulować kliknięcie kotwicy w jQuery?”. Możesz użyć metod „trigger” lub „triggerHandler”, na przykład:

<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>

Nie testowane, to rzeczywisty skrypt, ale użyłem triggeri wsp. Wcześniej i działały dobrze.

UPDATE w
triggerHandler rzeczywistości nie robi tego, czego chce OP. Myślę, że 1421968 dostarcza najlepszej odpowiedzi na to pytanie.

Proponuję przyjrzeć się API Selenium, aby zobaczyć, jak wywołują kliknięcie elementu w sposób zgodny z przeglądarką:

• selenium-browserbot.js

Poszukaj BrowserBot.prototype.triggerMouseEventfunkcji.

Uważam, że możesz użyć:

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

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

Spowoduje to łatwe uruchomienie funkcji klikania, bez faktycznego klikania go.

Czy musisz sfałszować kliknięcie kotwicy? Z witryny Thickbox:

ThickBox można wywołać z elementu łącza, elementu wejściowego (zwykle przycisku) i elementu obszaru (mapy obrazów).

Jeśli to jest do zaakceptowania, powinno być tak proste, jak umieszczenie klasy grubego pudełka na samym wejściu:

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

Jeśli nie, polecam użycie Firebuga i umieszczenie punktu przerwania w metodzie onclick elementu kotwicy, aby sprawdzić, czy jest uruchamiany tylko przy pierwszym kliknięciu.

Edytować:

Okay, musiałem to wypróbować i dla mnie prawie dokładnie twój kod działał zarówno w Chrome, jak i Firefox:

<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>

Okno wyskakuje bez względu na to, czy kliknę element wejściowy, czy zakotwiczony. Jeśli powyższy kod działa dla Ciebie, sugeruję, że błąd leży gdzie indziej i spróbuj wyizolować problem.

Inną możliwością jest to, że używamy różnych wersji jquery / thickbox. Używam tego, co dostałem ze strony Thickbox - jQuery 1.3.2 i thickbox 3.1.

Możesz utworzyć formularz za pomocą jQuery lub w kodzie strony HTML z akcją, która naśladuje twój odnośnik href:

<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();

Aby zasymulować kliknięcie kotwicy podczas lądowania na stronie, po prostu użyłem jQuery do animacji właściwości scrollTop w $(document).ready.Nie ma potrzeby stosowania złożonego wyzwalacza i działa to w IE 6 i każdej innej przeglądarce.

Jeśli nie musisz używać JQuery, tak jak ja nie. Miałem problemy z działaniem w różnych przeglądarkach .click(). Więc używam:

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

W Javascript możesz to zrobić

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();
    }
}

i możesz go używać jak

submitRequest("target-element-id");

Używając skryptu Jure'a, zrobiłem to, aby łatwo „klikać” tyle elementów, ile chcesz.
Właśnie użyłem go Czytnik Google na ponad 1600 pozycjach i działał idealnie (w przeglądarce Firefox)!

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

JQuery('#left').triggerHandler('click');działa dobrze w Firefoksie i IE7. Nie testowałem tego na innych przeglądarkach.

Jeśli chcesz uruchamiać automatyczne kliknięcia użytkowników, wykonaj następujące czynności:

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

To nie działa w natywnej przeglądarce Androida, aby kliknąć „ukryty element wejściowy (plik)”:

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

Ale to działa:

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

Próbując zasymulować „kliknięcie” w testach jednostkowych za pomocą pokrętła jQuery UI, nie udało mi się uzyskać żadnej z poprzednich odpowiedzi. W szczególności próbowałem zasymulować „obrót” po wybraniu strzałki w dół. Spojrzałem na testy jednostkowe jQuery UI spinner i używają następującej metody, która zadziałała dla mnie:

element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup();