如何改变输入成一列复选框点击

Question

更改选中的复选框行

注输入字段名称字段名称：类型字段可能或不可能每一行中存在。

如果名称[]和类型[]字段存在，则将名称更改为name1 []和type1 []。或者如果类型[]不存在，只需更改名称[]字段的名称。

$(document).ready(function() { 
 
$(".click1").on('change', function() { 
 
      if($(this).is(":checked")) {   
 
       alert('checked') 
 
      }   
 
     }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<li id="row_3"> 
 
    <div class="col-md-6"> 
 
     <input type="text" name="name[]"> 
 
     <input type="text" name="type[]"> 
 
     <input type="checkbox" name="click" class="click1"> 
 
     </div> 
 
    </div> 
 
</li>

Answer 1

您应该.find('input[name^="type"]')，并检查它是否存在，如果是的话，其他的输入元素的name更改为name1。下面是更新后的代码：

$(document).ready(function() { 
 
    $(".click1").on('change', function() { 
 
    if ($(this).is(":checked")) { 
 
     if ($(this).parent().find('input[name^="type"]').length) { 
 
     $(this).parent().find('input[name^="name"]').prop('name', 'name1[]'); 
 
     } 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<li id="row_3"> 
 
    <div class="col-md-6"> 
 
    <input type="text" name="name[]"> 
 
    <input type="text" name="type[]"> 
 
    <input type="checkbox" name="click" class="click1"> 
 
    </div> 
 
</li>

Answer 2

添加id s到两种元素，这样就可以很容易地在代码中访问它们。

<input type="text" id="name" name="name[]"> 
<input type="text" id="type" name="type[]"> 

而且，你的jQuery中，改名字是这样的：

$(document).ready(function() { 
    $(".click1").on('change', function() { 
    if($(this).is(":checked")) {   
     $("#name").attr("name", "name1[]"); 
     $("#type").attr("name", "type1[]"); 
    }   
    }); 
}); 

的好处是，如果去掉#type场，$("#type")将返回一个空集，你会不会做任何事情。