A simple example of Jquery working with radio

  • 2020-03-30 01:12:50
  • OfStack

< Input name="study" type="radio" value="Jquery plugin tutorial "> Jquery plug-in tutorial
< Input name="study" type="radio" value="Jquery learning "> Jquery learning
< Input name="study" type="radio" value="PHP learning "> PHP learning
< Input id="tijiao" type="button" value=" ok ">
< Input id="set_jqeury_study" title="Jquery learning "type="button" value=" set radio to Jquery learning ">
< Input name="study" type="text" value=" please enter what you want to learn ">
< Input id="view_input_text" type="button" value=" click on me to see the same name 'study', but the type is the value in the TEXT field ">

In the HTML code above, you should notice that the name property of the 3 radio and the name property of the 1 text are both "study"


$(function(){
$('#tijiao').click(function(){
if ($("input:[name=study]:radio:checked").length == 0){
alert(" Please choose what you want to learn ");
return false;
}
var study = $("input:[name=study]:radio:checked").val();
alert(" Thank you very much! You chose " + study);
})
$("#set_jqeury_study").click(function(){
var $button = $(this);
$("input:[name=study]:radio").each(function(){
if (this.value == $button.attr('title')){
this.checked=true;
}
})
})
$("#view_input_text").click(function(){
alert($("input[name=study]:text").val());
})
})

$(" input:[name=study]:radio:checked ") this code gets all the jquery objects whose name attribute is "study" and which have been selected. You can tell whether one of the radio options is selected by determining whether its length is equal to 0. $(" input[name=study]:text ") this code gets the jquery object of the text field whose name attribute is "study".


Related articles: