【问题标题】:How to check 2 checkboxes that have the same name如何检查2个具有相同名称的复选框
【发布时间】:2014-08-15 23:38:16
【问题描述】:

所以我有一个 ajax 搜索表单,它提供带有复选框的结果: 以下是每个搜索结果的部分 PHP 代码:

<input type="checkbox" class="lovkrav_checkbox checkbox_search" name="lovkrav['.$lovkrav_id.']" value="'.$lovkrav_id.'" orig-id="lovkrav'.$lovkrav_id.'" id="lovkravs'.$lovkrav_id.'" '.$checked.'/>

网站上已经有一个同名但 ID 不同的双复选框。 通过使用“orig-id”属性,我得到了双复选框的 id。两个复选框具有相同的类 lovkrav_checkbox

我已经到了双复选框检测到单击事件的地步,但不是您单击的复选框! 代码如下:

 $(document).on("click",".lovkrav_checkbox",function(e){
    toggle_id = document.getElementById($(this).attr("orig-id"));        
    $(toggle_id).trigger("click");
});

我想要实现的是当用户点击一个复选框时 - 双复选框(具有相同名称属性的那个)也将被选中/取消选中。

我做错了什么?

【问题讨论】:

  • 我不明白您要做什么,请编辑您的问题并澄清。
  • 我想要实现的是当用户点击一个复选框时 - 双复选框(具有相同名称属性的那个)也将被选中/取消选中。
  • @trojan 这里的陷阱是,如果您的页面加载时选中了其中一​​个复选框。这可能是这种情况吗?在这种情况下,您希望每次点击都选中未选中和未选中选中?

标签: javascript jquery ajax checkbox forms


【解决方案1】:

使用 vanilla javascript 切换选中状态会更容易。

HTML

<input type="checkbox" name="test">
<input type="checkbox" name="test">

JS

//All of the checkboxes
var $checkboxes = $("input[type=checkbox][name=test]");

//The event handler
$checkboxes.on("click", function() {
    //Get the state of the check box you clicked
    var checkedState = this.checked

    //Make it the state of all the checkboxes
    $checkboxes.each(function() {
        this.checked = checkedState;
    });
});

这里是fiddle

【讨论】:

  • 我收到此错误:错误:语法错误,无法识别的表达式:输入[type=checkbox][name=lovkrav[621]]
  • 我明白了!,必须在配额中转义名称: var $checkboxes = $("input[type=checkbox][name=\'"+$(this).attr(\'名称\')+"\']");
  • 您可能希望将 $checkboxes 选择器更改为在生产中更具体的东西。也许试试.lovkrav_checkbox[name=\'"+$(this).attr(\'name\')+"\']
【解决方案2】:

你可以试试这个:

DEMO

 $(document).on("click",".check",function(e){
    $("."+this.className).prop("checked", this.checked);
 });

【讨论】:

  • 这不会发生,因为它会切换所有具有相同类的复选框
【解决方案3】:

试试这个

$("input[type=checkbox][name=test]").prop("checked",true);

【讨论】:

    【解决方案4】:

    也试试这个:

    js:

     $(document).on("click",".lovkrav_checkbox",function(e){
        toggle_id = $(this).attr("name");
         isChecked = $(this).prop("checked");
         $("input:checkbox").each(
             function(){
    
                 if($(this).attr("name") == toggle_id && isChecked){
                     $(this).prop("checked",true);
                 }
                 else{
                     $(this).prop("checked",false);
                 }
             });
    });
    

    fiddle

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2023-03-31
      • 1970-01-01
      • 1970-01-01
      • 2012-02-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-06-09
      相关资源
      最近更新 更多