2017-07-09 4 views
0

J'essaie de déclencher un événement .onclick() lorsque je survole un autre élément div.Déclenchez .onclick() en survolant un autre élément

L'élément qui doit déclencher l'événement .onclick() a l'ID #exp_des_p_trig.

See Console.

L'élément qui doit être déclenché a la valeur href #exp_des_p dans un une étiquette.

See console.

Je peux comprendre les bases de lecture/JS, mais je ne peux pas l'écrire (encore), je pense quelque chose comme ceci:

<script> 
jQuery('#exp_des_p_trig').hover(); 
    jQuery('#exp_des_p').onclick(); 
</script> 

Quelqu'un peut-il me aider à corriger cela pour que cela fonctionne?


MISE À JOUR:

I emailed support Visual Composer à ce sujet et c'est la réponse que je suis:

au lieu de déclencher un événement de clic vous pouvez attacher la classe vc_active à la visite vc_tta -tab et vc_tta-panel via js. La classe vc_active est responsable de l'ouverture d'un contenu de visite pour l'affichage.

Merci pour les réponses ci-dessous, il semble que ce soit un problème Visual Composer que je vais aborder ailleurs.

+0

Vérifiez ma réponse, et vérifiez vos sélecteurs 'jQuery ('# exp_des_p')'! ce sélecteur signifie: sélectionner un élément avec l'attribut 'id' avec la valeur' exp_des_p'.Contrôler [this] (https://api.jquery.com/id-selector/) –

+0

@ JanCiołek hey t J'ai maintenant un peu de réponse de la part des éléments, en survolant l'élément de déclenchement, une notification du navigateur indique que la partie supérieure fonctionne, mais pas le déclencheur de stationnaire - c'est le code que j'utilise : https://jsfiddle.net/rzkrto1o/ - savez-vous où est mon problème? –

+0

Vérifiez votre sélecteur je parie qu'il manque quelque chose. –

Répondre

1

Comme vous avez seulement besoin de l'événement pour la souris entrant dans l'élément, vous pouvez utiliser l'événement mouseenter, puis cibler l'élément avec le href donné et déclencher un clic

$('#exp_des_p_trig').on('mouseenter', function() { 
 
    $('[href="#exp_des_p"]').trigger('click'); 
 
}); 
 

 
$('[href="#exp_des_p"]').on('click', function() { 
 
    console.log('works fine !') 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="exp_des_p_trig">Hover me !</div> 
 
<a href="#exp_des_p"></a>

Notez que le déclenchement d'un clic sur une ancre ne redirige pas, il déclenche simplement les gestionnaires d'événements attachés.

+0

merci, cela ne semble pas fonctionner malheureusement, y at-il autre chose que je pourrais manquer? –

0

c'est une solution:

$(document).ready(function(){ 
    $('#divhover').hover(function (event){ 
    alert("divhover_hover"); 
    $("#aClick").trigger("click"); 
    }); 

    $('#aClick').on('click',function(event){ 
    alert("aClick_click"); 
    }); 

}) 
+0

vous pouvez sostitude un selctor avec quoi avez-vous besoin de @adeneo post –

2

Découvrez trigger method

var red = $('#clickAbleElement').click(function(){ 
 
    alert('You have clicked on red'); 
 
}) 
 

 
var green = $('#hoverMe').hover(function(){ 
 
    red.trigger('click'); 
 
})
#clickAbleElement { 
 
    width:100px; 
 
    height:100px; 
 
    background-color:red; 
 
} 
 

 
#hoverMe { 
 
    width:100px; 
 
    height:100px; 
 
    background-color:green; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="clickAbleElement">Click Me</div> 
 
<div id="hoverMe">Hover Me</div>