i trying to hide input box for name if checkbox gets checked:
if($(#1step).checked){
$("input[username="true").hide
}
<input username="true">
<input type="checkbox" id="1step"><label>step1</label>
Add a comment
|
3 Answers
Some notes:
1) Wrap your value in quotes ' ' or double quotes " "
2) Use $("input[username='true']") instead of $("input[username="true")
3) Use <label> instead of <lavel>
4) Use change() event to keep track when your checkbox has been checked or unchecked
5) Trigger change event manually to make sure that the visibility of your textbox has been set properly on page load
Final code look like:
$(function () {
$('#1step').change(function () {
if ($('#1step').is(':checked')) {
$("input[username='true']").hide();
} else {
$("input[username='true']").show();
}
}).change();
});
or you can shorten your code to:
$(function () {
$('#1step').change(function () {
$("input[username='true']").toggle(this.checked);
}).change();
});
1 Comment
user3395352
thank you added my fade exampel with yours very much hepl thanks
You need to have change event handler listening to the change in the checked state of the checkbox and update the visibility of the textbox accordingly(you can use .toggle() to set it). Also you can manually fire the change() event after the handler is added so that the initial visibility of the text field will be set properly
jQuery(function ($) {
$('#1step').change(function () {
$('input[username="true"]').toggle(this.checked)
}).change();//initialize with correct display state
});
Demo: Fiddle
Comments
Something like this:
$('#1step').change(function() {
$("input[username='true']").toggle(this.checked);
}).change();
Make sure to trigger change event initially in case you have HTML coming with checked="true" by default.
