A radio buttons is a form element used if we want the user to select one option from the multiple options.
The difference between radio buttons and check boxes is that, radio button allows to select only one option from multiple options and in check boxes, multiple options can be selected.
Below is the example of radio buttons. Only one input will be selected.
<p>
Male: <input type="radio" name="gender" /><br />
Female: <input type="radio" name="gender" /><br />
Other: <input type="radio" name="gender" />
</p>
If we want a radio button to be already checked, then we will put "checked" in input box.
<input type="radio" name="gender" checked/>
Here is the example to open a div on check of a radio button:-
HTML-
<span>Do you want to ask any question?</span>
<label for="chkYes">
<input type="radio" id="chkYes" name="chkQstn" />
Yes
</label>
<label for="chkNo">
<input type="radio" id="chkNo" name="chkQstn" />
No
</label>
<hr />
<div id="dvqstn" style="display: none">
Ask Here:
<input type="text" id="txtQuestion" />
</div>
jQuery-
$(function () {
//on click of an input whose name is chkQstn
$("input[name='chkQstn']").click(function () {
//it will check if the checked input has id chkYes
if ($("#chkYes").is(":checked")) {
//then the hidden div will be shown
$("#dvqstn").show();
} else {
$("#dvqstn").hide();
}
});
});
Below is the link of above code:-
https://jsfiddle.net/rm1dt4r2/1/
0 Comment(s)