Je veux laisser l'utilisateur aller sur un site Web lorsqu'il a cliqué sur ma photo de fond (parent div), mais la fonction doit être fermée lorsque l'utilisateur a cliqué sur le contenu de mon site Web (enfant div), puis lorsque l'utilisateur a cliqué sur l'image de fond ( Parent div) à nouveau, la fonction sera une activité.
J'essaie plusieurs fois, mais quand j'ai cliqué sur mon contenu de mon site Web (enfant div), puis cliqué sur la photo de fond (parent div), la fonction n'a pas fonctionné.
Que puis-je faire? Merci! P>
Voici mon code: P>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"></meta>
<title>Test!</title>
<style type="text/css">
.head{
background-color:#FF88C2; color:#9955FF; font-weight:bold; font-size:30px;
text-align:center; padding:10px;
}
.tt{
width:100%; height:100%;
border:1px solid red;
}
.content{
width:800px; height:1000px; margin-left:auto; margin-right:auto; background-color: aliceblue;
border:1px solid blue;
}
</style>
<script type="text/javascript">
function bgADlink(){
window.open('https://www.google.com');
}
var i = 0;
function test1(){
if(i == 0 || i == 1)
bgADlink();
return i = 0;
}
function test2(){
bgADlink=false;
return i = 1;
}
</script>
</head>
<body style="margin:0px; background-color:#eeeeee;">
<div class="head">Test</div>
<div class="tt" onclick="test1()">
<div class="content" onclick="test2()"></div>
</div>
</body>
</html>
4 Réponses :
Il y a des problèmes différents dans votre code.
Parce que les événements se propagent d'un élément interne, à son élément parent (non seulement parent, mais toute la hiérarchie jusqu'à la hiérarchie), la "TT" div tire toujours, alors la meilleure chose à faire est d'arrêter la propagation des événements avec Je ne comprends pas vraiment ce que vous essayez d'accomplir avec le "I" et pourquoi vous avez une fonction bgadlink () puis l'affectant un booléen, JavaScript vous permet de le faire, mais votre fonction est maintenant un booléen. Je vous ai fait un petit échantillon de violation que vous pouvez voir le travail d'arrêt, espérons qu'il aide .
Cet extrait de ce snippet n'ouvre pas la liaison DIV parent non..mais Utilisez ceci sur la page HTML, puis essayez-le
p>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"></meta>
<title>Test!</title>
<style type="text/css">
.head{
background-color:#FF88C2; color:#9955FF; font-weight:bold; font-size:30px;
text-align:center; padding:10px;
}
.tt{
width:100%; height:100%;
border:1px solid red;
}
.content{
width:800px; height:1000px; margin-left:auto; margin-right:auto; background-color: aliceblue;
border:1px solid blue;
}
</style>
<script type="text/javascript">
var i = 0;
function test1(){
if(i == 0 || i == 1)
bgADlink();
return i = 0;
}
function test2(varr,event){
// bgADlink=false;
event.stopPropagation();
return i = 1;
}
function bgADlink(){
console.log("bgADlink")
window.open('https://www.google.com');
}
</script>
</head>
<body style="margin:0px; background-color:#eeeeee;">
<div class="head">Test</div>
<div class="tt" onclick="test1()">
<div class="content" onclick="test2('',event)"></div>
</div>
</body>
</html> Je ne suis pas sûr que ce soit ce dont vous avez besoin, mais en gros, vous devez arrêter l'événement bouillonnant d'enfant vers le parent.
Il suffit de supprimer ça || I == 1 condition de Test1 () fonctionne comme ci-dessous.
function test1(){
if(i == 0)
bgADlink();
return i = 0;
}
Bonjour, alors qu'entendez-vous par "mais la fonction doit être fermée"? Désactivée? Qu'est-ce que le parent div? Élément de corps ou un peu de div? Dans l'exemple de code, vous n'avez pas de parent et d'enfant divs. Pouvez-vous dire exactement quel DIV doit avoir cette action onclick?
@ Maximelian1986
Vous n'avez pas de parent et d'enfant divs Il y a la DIV avec classTT (parent) et classecontenu (enfant) . Mais je pense que l'OP a vraiment besoin de relancer sa question car il est très déroutant ce qui est recherché.