如果在单击按钮之前遗漏了不同单选按钮集中的任何单选按钮,则发出警报



我有这个jquery,它从不同的单选按钮集获取单选按钮输入。如果这 3 个中的任何一个在按钮单击之前被选中,我想提醒用户。这是jquery:

 $("#query").click(function() {  
  $("#loading-div-background").show();
  $("#img").hide()
  $("#container").hide();
  var category = $('input:radio[name=category]:checked').val();
  var time = $('input:radio[name=time]:checked').val()
  var plotchoice = $('input:radio[name=plotchoice]:checked').val()
  var qu = {"category":category,"time":time,"plotchoice":plotchoice}
  $.ajax({
    type: "POST",
    async:true,
    contentType: "application/json; charset=utf-8",
    url: "/query",
    data: JSON.stringify(qu),
    success: function (data) {     
     var graph = $("#container");
     graph.html(data);   
     $("#loading-div-background").hide();      
     $("#container").show();
   },
   dataType: "html"
 });
});

这是 HTML:

 <label style="font-family: Comic Sans MS;">Choose a category:</label><br/>
    <!--set 1-->
<input type="radio" name="category" value="c1"><label style="margin-left: 10px;font-family: Comic Sans MS;; vertical-align: middle;">Status</label> </input>
&nbsp;
<input type="radio" name="category" value="c2"><label style="margin-left: 10px;font-family: Comic Sans MS;; vertical-align: middle;">Trend</label> </input><br>
<!-- sset 2-->
<br/>
<label style="font-family: Comic Sans MS;">Choose a time frame:</label><br/>
<input type="radio" name="time" value="t1"><label style="margin-left: 10px;font-family: Comic Sans MS;; vertical-align: middle;"> Recently</label> </input>
&nbsp;
<input type="radio" name="time" value="t2"><label style="margin-left: 10px;font-family: Comic Sans MS;; vertical-align: middle;"> Last 1 Week</label> </input>
&nbsp;
<input type="radio" name="time" value="t2"><label style="margin-left: 10px;font-family: Comic Sans MS;; vertical-align: middle;"> Last 1 Month</label> </input>
&nbsp;
<input type="radio" name="time" value="t2"><label style="margin-left: 10px;font-family: Comic Sans MS;; vertical-align: middle;"> Last 1 Year </label></input>
&nbsp;
<br/>
<br/>
<!--set 3-->
<label style="margin-left: 10px;font-family: Comic Sans MS;">Choose a plot type:</label><br/>
<input type="radio" name="plotchoice" value="p1"><label style="margin-left: 10px;font-family: Comic Sans MS;;  vertical-align: middle;"> Bar </label></input>
&nbsp;
<input type="radio" name="plotchoice" value="p2"><label style="margin-left: 10px;font-family: Comic Sans MS;;  vertical-align: middle;"> Line </label></input><br>
<br/>
<button type="button" id="query" style="font-family: Comic Sans MS;;  vertical-align: middle;">View Plot</button>

如您所见,我已经标记了 3 组单选按钮,在单击按钮之前需要从中选择每组一个 foo。如果遗漏了其中任何一个或没有选择任何内容,我想显示警告。 注意:jquery 的新增功能

任何帮助,不胜感激。谢谢!!

可以像这样检查单选按钮的状态:

$('button').click(function() {
  if ($('#radio').is(':checked')) { 
    console.log("Is checked"); 
  } else {
    console.log("Not checked");
  }
});

相关内容