Question

我的代码中有多个复选框

<label>
 <input name="meta[Radio & Speakers]" class="flat" type="checkbox" value="YES"> Radio & Speakers
</label>

每当取消选中复选框时，隐藏的输入将放在未选中的复选框之前，并使用相同的名称：

$('input').on('ifUnchecked', function(event){
    name = $(this).attr('name');

    if($('input[type="checkbox"][name="'+name+']"').length == 0){
        $(this).before('<input type="hidden" name="'+name+'" value="NO"/>');
    }

});

我想通过使用$('input[type="checkbox"][name="'+name+']"').length检查隐藏输入是否存在来避免多次插入隐藏输入，但它似乎失败了，我在这里错过了一些东西...

手动添加隐藏的复选框对我的方案来说是不可行的，因为它们太多了。

Answer 1

你必须这样做： -

1.使用click事件。（如果使用插件，那么请使用您的初始事件ifUnchecked ）

2.选中或取消选中该复选框。

3.如果未选中复选框，则检查已隐藏的输入是否有。如果没有，则只添加隐藏的输入。

检查以下代码段。

$(document).ready(function(){
  $('input').on('click', function(event){ //or use $('input').on('ifUnchecked', function(event){
    name = $(this).attr('name');
    if(!$(this).is(":checked")){
     if($(this).parent('label').find('input[type="hidden"]').length ==0){
        $(this).before('<input type="hidden" name="'+name+'" value="NO"/>');
     }
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label><input name="meta[Radio & Speakers]" class="flat" type="checkbox" value="YES"> Radio & Speakers</label>

适用于数组名称为

1 个答案: