Comment ajouter ou joindre“, cliquez sur” écouteur d'événement dans les DOM?
Ne suis pas en mesure d'ajouter des événements à un id. Si la possibilité de joindre événement auditeur onLoad mais même pas de travail pour onClick ou cliquez sur. Quelqu'un peut-il m'aider à résoudre ce problème?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" id="iphone-viewport" content="minimum-scale=1.0, maximum-scale=1.0, width=device-width">
<title>Astro Wheel</title>
<script type="text/javascript">
function loaded() {
alert("Loaded")
var ele= document.getElementById("aries");
if (window.attachEvent)
{ ele.attachEvent('click', testFunction); }
else if (window.addEventListener)
{ ele.addEventListener('click', testFunction, true); }
//I am unable to register a event on #aries, below alerts giving "null" and "undefined" respectively
alert(ele.onclick);
alert(ele.click)
}
function testFunction(){
alert("Clicked")
}
window.addEventListener("load", function() { setTimeout(loaded, 100); }, true);
</script>
<style type="text/css">
body, ul, li, div, p { padding:0; margin:0; }
body { background:#444 url(bg.png); }
#wheel { position:absolute; z-index:1; width:320px; height:321px; overflow:hidden; }
#display1 { position:absolute; z-index:100; width:320px; height:321px; }
ul { position:absolute; z-index:10; width:320px; height:320px;
-webkit-transform-origin:50% 50%;
-webkit-transform:rotateZ(0rad);
text-align:center;
}
ul li { position:absolute; z-index:11; width:76px; height:88px; left:122px; top:22px; overflow:hidden;
-webkit-transform-origin:38px 138px;
-webkit-transition-timing-function:ease-out;
-webkit-transition-duration:800ms;
}
#aries { -webkit-transform:rotate(0deg) translate(0, -0px); }
#cancer { -webkit-transform:rotate(90deg) translate(0, -000px); }
#libra { -webkit-transform:rotate(180deg) translate(0, -0000px); }
#caprico { -webkit-transform:rotate(270deg) translate(0, -000px); }
</style>
</head>
<body>
<div id="wheel">
<div id="display1"></div>
<ul id="zodiac">
<li id="aries"><div>Aries</div></li>
<li id="cancer"><div>Cancer</div></li>
<li id="libra"><div>Libra</div></li>
<li id="caprico"><div>Caprico</div></li>
</ul>
<div id="ok"></div>
</div>
</body>
</html>P. S. je ne suis pas autorisé à utiliser tout cadre.Les tests sur WEBKIT mobile basé sur un navigateur et Google Chrome n'
- Je crois que ce qui doit être affiché sur un Débordement de Pile. La Revue de Code est pour l'examen de code de travail.
- Si votre question est "Comment faire pour...", alors ce que vous me demandez est pas un examen. Ça, c'est sur un Débordement de Pile.
- Tout organisme peut s'il vous plaît dites-moi où vais mal. J'ai mis à jour des tests d'info.
- Pour être honnête, je ne suis pas sûr. Si j'ai mis le gestionnaire de clic sur "display1" il fonctionne, mais pas sur le
<li>balises. - ok, ça ressemble à quelque chose dans votre CSS (z-commandes?) est la prévention sur les événements de eaching votre
<li>balises. - jsfiddle.net/kNnVH/21 Voici un test. Je suppose que son travail sans css, webkit attributs. Peut-webkit attributs être un problème??
- c'est votre
#display1de la classe, il a une forte zorder donc se superpose à l'autre de la vrd, de les empêcher d'être cliqué. - Correct. Résolu.Merci
Vous devez vous connecter pour publier un commentaire.
À l'aide de
addEventListener(ou IEattachEvent) ne modifie pas le contenu de laonclickles attributs qu'ils sont indépendants.Il ne devrait pas y avoir besoin de temps de retard de la
loaded()la fonction juste ne:window.addEventListener('load', loaded, false);Si vous êtes en supposant que le W3C DOM la gestion des événements (que votre
loadgestionnaire n'), alors il n'y a pas besoin de l'IE-onyattachEvent()appel