¿Cómo puedo simular un clic de anclaje mediante jquery?

Tengo un problema al fingir un clic de anclaje a través de jQuery: ¿Por qué aparece mi caja gruesa la primera vez que hago clic en el botón de entrada, pero no la segunda o la tercera vez?

Aquí está mi código:

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

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

Siempre funciona cuando hago clic directamente en el enlace, pero no si trato de activar el cuadro grueso mediante el botón de entrada. Esto está en FF. Para Chrome parece funcionar todo el tiempo. ¿Alguna pista?

Intenta evitar incluir tus llamadas de jQuery de esa manera. Coloque una etiqueta de script en la parte superior de la página para vincularla al clickevento:

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

Editar:

Si está tratando de simular que un usuario haga clic físicamente en el enlace, entonces no creo que sea posible. Una solución alternativa sería actualizar el clickevento del botón para cambiar el window.locationJavascript en:

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

Edición 2:

Ahora que me doy cuenta de que Thickbox es un widget personalizado de jQuery UI, encontré las instrucciones aquí :

Instrucciones:

• Crear un elemento de enlace ( <a href>)

• Dele al enlace un atributo de clase con un valor de thickbox ( class="thickbox")

• En el hrefatributo del enlace, agregue el siguiente ancla:#TB_inline

• En el hrefatributo después de #TB_inlineagregar la siguiente cadena de consulta en el ancla:

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

• Cambie los valores de altura, ancho e inlineId en la consulta en consecuencia (inlineID es el valor de ID del elemento que contiene el contenido que desea mostrar en un ThickBox.

• Opcionalmente, puede agregar modal = true a la cadena de consulta (por ejemplo #TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true) para que cerrar un ThickBox requiera llamar a la tb_remove()función desde el ThickBox. Vea el ejemplo de contenido modal oculto, donde debe hacer clic en sí o no para cerrar ThickBox.

Lo que funcionó para mí fue:

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

Recientemente he encontrado cómo activar el evento de clic del mouse a través de 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>

Este enfoque funciona en Firefox, Chrome e IE. Espero que ayude a alguien:

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

Aunque esta es una pregunta muy antigua, encontré algo más fácil de manejar esta tarea. Es el complemento jquery desarrollado por el equipo jquery UI llamado simulate. puedes incluirlo después de jquery y luego puedes hacer algo como

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

funciona bien en Chrome, Firefox, Opera e IE10. Puede descargarlo desde https://github.com/eduardolundgren/jquery-simulate/blob/master/jquery.simulate.js

El título de la pregunta dice "¿Cómo puedo simular un clic de anclaje en jQuery?". Bueno, puedes usar los métodos "trigger" o "triggerHandler", así:

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

No probado, este script real, pero he usado trigger et al antes, y funcionaron bien.

ACTUALIZACIÓN en
triggerHandler realidad no hace lo que quiere el OP. Creo que 1421968 proporciona la mejor respuesta a esta pregunta.

Sugeriría mirar la API de Selenium para ver cómo activan un clic en un elemento de manera compatible con el navegador:

• selenium-browserbot.js

Busca la BrowserBot.prototype.triggerMouseEventfunción.

Creo que puedes usar:

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

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

Esto activará fácilmente la función de clic, sin hacer clic en ella.

¿Necesitas fingir un clic de anclaje? Desde el sitio de thickbox:

ThickBox se puede invocar desde un elemento de enlace, un elemento de entrada (generalmente un botón) y el elemento de área (mapas de imagen).

Si eso es aceptable, debería ser tan fácil como poner la clase thickbox en la entrada:

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

De lo contrario, recomendaría usar Firebug y colocar un punto de interrupción en el método onclick del elemento de anclaje para ver si solo se activa en el primer clic.

Editar:

De acuerdo, tuve que probarlo por mí mismo y para mí casi exactamente su código funcionó tanto en Chrome como en 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>

La ventana emergente no importa si hago clic en la entrada o en el elemento de anclaje. Si el código anterior funciona para usted, sugiero que su error se encuentre en otra parte y que intente aislar el problema.

Otra posibilidad es que estamos usando diferentes versiones de jquery / thickbox. Estoy usando lo que obtuve de la página de thickbox: jquery 1.3.2 y thickbox 3.1.

Puede crear un formulario a través de jQuery o en el código de la página HTML con una acción que imite su enlace 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();

Para simular un clic en un ancla mientras aterrizaba en una página, simplemente utilicé jQuery para animar la propiedad scrollTop en $(document).ready.Sin necesidad de un disparador complejo, y eso funciona en IE 6 y en cualquier otro navegador.

Si no necesita usar JQuery, como yo no. He tenido problemas con la función de navegador cruzado de .click(). Entonces uso:

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

En Javascript puedes hacer así

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

y puedes usarlo como

submitRequest("target-element-id");

Utilizando el script de Jure, hice esto para "hacer clic" fácilmente en tantos elementos como desee.
¡Acabo de usar Google Reader en más de 1600 artículos y funcionó perfectamente (en Firefox)!

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

JQuery('#left').triggerHandler('click');funciona bien en Firefox e IE7. No lo he probado en otros navegadores.

Si desea activar clics automáticos de usuario, haga lo siguiente:

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

Esto no funciona en el navegador nativo de Android para hacer clic en "elemento de entrada oculta (archivo)":

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

Pero esto funciona:

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

Al tratar de simular un 'clic' en las pruebas unitarias con la flecha giratoria jQuery UI, no pude obtener ninguna de las respuestas anteriores para trabajar. En particular, estaba tratando de simular el 'giro' de seleccionar la flecha hacia abajo. Miré las pruebas unitarias spinner jQuery UI y utilizar el siguiente método, que trabajó para mí:

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