mardi 7 juin 2016

Hiding/showing paragraphs according to checkbox's checked status and input text value

There are 4 paragraphs, a blank text field, 1 checkbox and a button.

I want 1 paragraph to hide when I check the checkbox and write "1" in the field, 2 paragraphs to hide when I check the checkbox and write down 2, etc.

The HTML:

<p class="p1">P1</p>
<p class="p2">P2</p>
<p class="p3">P3</p>
<p class="p4">P4</p>

<input id="txt" type="text" name="fld" value="" /> <br /> <br />

P <input id="pcheck" type="checkbox" name="pcheckbox" /> <br /> <br />

<input id="disapp" type="button" value="Disappear" />

The Javascript:

$(document).ready(function(){
$("#disapp").click(function() {
if(($("#pcheck").is(":checked")) && ($(#txt).val()=="1") {
$(".p1").hide();    
}
});
});

I tried formatting it also like this:

$(document).ready(function(){
$(disapp).click(function() {
if(($pcheck.checked) && ($txt.value()=="1")) {
$p1.hide();     
}
});
});

And don't know which formatting is more correct and I don\t know how to make it work...

Please, don't be too strict, I'm a beginner.

Aucun commentaire:

Enregistrer un commentaire