获取具有相同类的值复选框答案

【问题标题】：Get value checkbox with the same class获取具有相同类的值复选框
【发布时间】：2019-07-19 13:35:35
【问题描述】：

我需要从具有相同类和不同值的复选框中获取值，以便在激活提交底部并选择不同的复选框时获取这些值

<script>
  jQuery(.simple_search).click(function(){
    if (jQuery('.skey_send').is(":checked")){
     var s_key=jQuery(".skey_send").val();
     alert("Value is : "+s_key);
    } 
  });
</script>


<input type="submit" class="simple_search" name="send_s" value="GO" />

<input type="radio" name="s_key" class="skey_send" value="all" />All
<input type="radio" name="s_key" class="skey_send" value="card" />Card
<input type="radio" name="s_key" class="skey_send" value="phone" />Phone
<input type="radio" name="s_key" class="skey_send" value="price" />Price

问题总是我从第一个复选框中获得价值，但点击另一个或不同的复选框时却没有

我需要知道我需要实现什么或在我的代码中添加什么，以便在检查时从具有相同类的不同复选框中获取值

【问题讨论】：

分配不同的[name] 属性值，这些是无线电而不是复选框将type='radio' 更改为type='checkbox

标签： jquery ajax checkbox

【解决方案1】：

您只使用类来获得价值，所以为什么它总是获得第一个价值。您在获得价值时错过了课堂上的:checked。

jQuery('.simple_search').click(function() {
  if (jQuery('.skey_send').is(":checked")) {
    var s_key = jQuery(".skey_send:checked").val();
    alert("Value is : " + s_key);
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="submit" class="simple_search" name="send_s" value="GO" />

<input type="radio" name="s_key" class="skey_send" value="all" />All
<input type="radio" name="s_key" class="skey_send" value="card" />Card
<input type="radio" name="s_key" class="skey_send" value="phone" />Phone
<input type="radio" name="s_key" class="skey_send" value="price" />Price

【讨论】：

【解决方案2】：

请试试这个，为我工作:)

$(document).ready(function(){
var arr=[];
  $(".simple_search").on('click',function(){
 
   $(".skey_send").each(function(){
   var checked_Data=$(this).is(":checked");
   arr.push(checked_Data);
   });
     alert(arr);
  });
  });

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>

<input type="submit" class="simple_search" name="send_s" value="GO" />

<input type="checkbox" name="s_key" class="skey_send" value="all" />All
<input type="checkbox" name="s_key" class="skey_send" value="card" />Card
<input type="checkbox" name="s_key" class="skey_send" value="phone" />Phone
<input type="checkbox" name="s_key" class="skey_send" value="price" />Price

</body>
</html>

【讨论】：

如果.each 同名，则不需要
是的，你是对的，但有时它可能会有所帮助。@MarkSchultheiss

【解决方案3】：

您缺少一些单引号，应使用单选类型并查找选中的值。由于这些是单选按钮，因此只能设置一个，因此无需通过索引或任何其他方式获取特定的一个。如果你在它周围使用<label>，你也可以使文本描述可点击——我没有这样做，但它是为了可用性而建议的。我删除了条件，只是提醒undefined 但可以放回或默认设置。

jQuery('.simple_search').on('click', function() {
  var s_key = jQuery(".skey_send[type='radio']:checked").val();
  alert("Value is : " + s_key);// alerts "undefined" if none are set
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<input type="submit" class="simple_search" name="send_s" value="GO" />

<input type="radio" name="s_key" class="skey_send" value="all" />All
<input type="radio" name="s_key" class="skey_send" value="card" />Card
<input type="radio" name="s_key" class="skey_send" value="phone" />Phone
<input type="radio" name="s_key" class="skey_send" value="price" />Price

【讨论】：