Hallo,
ich habe ein CSS-Klick event für eine Checkbox.
Das funktioniert auch sehr gut. (siehe Beispiel 1)
Die Elemente liegen in einer Ebene, also kein Problem.
Das Problem ist, das das Element das ich ansprechen will, verschachtelt ist.
Wie kann ich das Element ansprechen, wenn es denn überhaupt geht. (siehe Beispiel 2)
Code
<style type="text/css">
fieldset{
width: 400px;
}
.to-be-changed{
display: block;
width: 150px;
margin-top: 20px;
margin-bottom: 20px;
text-decoration: none;
border:1px solid #25729a;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
font-family:arial, helvetica, sans-serif;
padding: 10px 10px 10px 10px;
text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
text-align: center;
color: #FFFFFF;
background-color: #3093c7;
pointer-events: none;
}
input[type=checkbox]:checked ~ .to-be-changed {
cursor: pointer;
pointer-events: auto;
}
Alles anzeigen
Code
<body>
<fieldset >
<legend>Beispiel 1 - funktioniert</legend>
<input type="checkbox">
<span>Stimmen Sie den Datenschutzerklärungen zu *</span>
<input class="to-be-changed" type="submit" name="" value="Senden" onclick="hallo();" />
</fieldset>
<p></p>
<p></p>
<p></p>
<fieldset>
<legend>Beispiel 2 - funktioniert nicht</legend>
<div id="eins"><input type="checkbox"><span>Stimmen Sie den Datenschutzerklärungen zu *</span></div>
<div id="zwei"><input class="to-be-changed" type="submit" name="" value="Senden" onclick="hallo();" /></div>
</fieldset>
</body>
Alles anzeigen