Pregunta

Tengo un problema con la falsificación de un ancla clic a través de jQuery: ¿Por qué aparece mi thickbox la primera vez que haga clic en el botón de entrada, pero no la segunda o 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>

No funciona siempre cuando hago clic directamente en el enlace, pero no si trato de activar el thickbox a través del botón de entrada. Esto es en FF. Para Chrome parece que funciona cada vez. ¿Alguna pista?

¿Fue útil?

Solución

Trate de evitar su inclusión entre líneas jQuery llama así. Poner una etiqueta de secuencia de comandos en la parte superior de la página para unirse al evento click:

<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 usted está tratando de simular un usuario haga clic en el enlace físicamente, entonces no creo que eso sea posible. Una solución podría ser la actualización evento click del botón para cambiar el window.location en Javascript:

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

Editar 2:

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

Instrucciones:

  • Crear un elemento de enlace (<a href>)
  • Dar el enlace de un atributo de clase con un valor de thickbox (class="thickbox")
  • En el atributo href del enlace de añadir el siguiente anclaje: #TB_inline
  • En el atributo href después de la #TB_inline añadir la siguiente cadena de consulta en la que el ancla:

    ? Height = 300 y width = 300 y inlineId = myOnPageContent

  • Cambiar los valores de la altura, la anchura y inlineId en la consulta en consecuencia (inlineID es el valor de la identificación del elemento que contiene el contenido que desea mostrar en un ThickBox.

  • Opcionalmente se puede añadir modal = true a la cadena de consulta (por ejemplo #TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true) de manera que el cierre de una ThickBox requerirá llamar a la función tb_remove() desde dentro de la ThickBox. Vea el ejemplo de contenido modal escondido, donde debe hacer clic en sí o no para cerrar la ThickBox.

Otros consejos

Lo que funcionó para mí fue:

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

He encontrado recientemente cómo activar evento de clic del ratón 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) {}

A pesar de que esto es muy vieja pregunta que he encontrado algo más fácil de manejar esta tarea. Es plugin de jQuery desarrollado por el equipo de jQuery UI llamado Simulación. puede incluirlo después de jQuery y luego se puede hacer algo como

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

funciona bien en Chrome, Firefox, Opera y IE10.you pueden 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 ancla clic en jQuery?". Bueno, se puede utilizar el "disparador" o "métodos 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 se ha probado, este script real, pero yo he utilizado trigger et al antes, y funcionaron A'ight.

Actualizar
triggerHandler realidad no hace lo que quiere el OP. Creo 1.421.968 proporciona la mejor respuesta a esta pregunta.

Yo sugeriría que mirar la API de selenio para ver cómo se disparan un clic en un elemento de una manera compatible con el explorador:

Busque la función BrowserBot.prototype.triggerMouseEvent.

Creo que se puede usar:

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

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

Esto hará que fácilmente la función de clic, sin tener que hacer clic en él.

¿Es necesario fingir un ancla clic? Desde el sitio thickbox:

  

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

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

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

Si no es así, yo recomendaría usar Firebug y la colocación de un punto de interrupción en el método onclick del elemento de anclaje para ver si sólo está activa en la primera posición.

Editar:

Está bien, tuve que probarlo para mí y para mí casi exactamente el código trabajó tanto en Chrome y 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>

Las ventanas pop ups no importa si hago clic en la entrada o el elemento de anclaje. Si el código anterior funciona para usted, sugiero el error está en otra parte y que intenta aislar el problema.

Otra posiblemente es que estamos utilizando diferentes versiones de jquery / thickbox. Estoy usando lo que obtuve de la página thickbox -. 1.3.2 jQuery y thickbox 3.1

Se puede crear un formulario a través de jQuery o en el código HTML de la página con una acción que imita 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 durante el aterrizaje en una página, acabo de utilizar jQuery para animar la propiedad scrollTop en $(document).ready. No hay necesidad de un disparador compleja, y que funciona en IE 6 y cualquier otro navegador.

Si no es necesario utilizar jQuery, ya no lo hago. He tenido problemas con la func navegadores de .click(). Así que uso:

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

En el Javascript se puede hacer como esto

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 se puede usar como

submitRequest("target-element-id");

Uso de la escritura de Jure hice esto, para poder "clic" tantos elementos como desee.
Yo sólo utilicé Google Reader en 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. Yo no lo he probado en otros navegadores.

Si desea activar el usuario hace clic automáticas hacer lo siguiente:

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

Esto no funciona en el navegador nativo de Android para hacer clic en "elemento oculto de entrada (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 de unidad con el control de giro jQuery UI no pude conseguir ninguna de las respuestas anteriores para trabajar. En particular, yo estaba tratando de simular el 'giro' de seleccionar la flecha hacia abajo. Miré el jQuery UI pruebas unitarias spinner y se utilizar el siguiente método, que trabajó para mí:

element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup();
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top