如何清除jquery中取消选中复选框时的文本框值？

Question

我有一个数据表（使用jQuery创建），其第一列包含复选框，最后一列包含文本框。由于文本框和复选框是动态创建的，所以它们具有相同的编号和名称是如下：

$('#statement-table').dataTable({ 
      "data": json, 
      "dom": 't', 
      "columns": [ 
       {"data":""}, 
       {"data": "statementCode"}, 
       {"data": "dueDate"}, 
       {"data": "statementBalance"}, 
       {"data": ""} 

      ], 
      "columnDefs": [ 
       {className: "pad-md-left-p-10 pad-top-bottom-p-10 white-active-bg mouse-link", "targets": [0,1,2,3,4]}, 
       { 
        'targets': 0, 
        'orderable': false, 
         'render': function(data, type, full, meta) { 
           return '<input type="checkbox" name="payment-checkbox" id="select-checkbox"/>'; 
         } 
       }, 

        { 
        'targets': 4, 
        'render': function (data, type, full, meta){ 
         return 
         '<input type="number" id="payement-textbox" name="text[]" class="payment" value=""/>'; 
        } 
        } 

      ], 
      "aaSorting": [[2, 'desc']], 

     }); //End of datatable function 

我的要求是明确的文本框的值时，其相应的复选框选中了。我写了下面的jquery代码，但它不清除文本框：

$("input[name=payment-checkbox]").click(function() { 
      $("table tr td input[type='checkbox']").each(function() { 
       var ischecked = $(this).is(":checked"); 
        if (!ischecked) { 
         $(this).parent().next().find("input[type='text']").val(""); 
        } 
        else 
        { 
         alert("do nothing"); 
        } 
       }); 
      }); 

请帮我这个。

Answer 1

There must not be multiple elements in a document that have the same id value.

使用name属性选择元素

$('[type="checkbox"]').on('change', function() { 
 
    if (!this.checked) { 
 
    $('[type="text"][name="' + this.name + '"]').val(''); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<input type="text" name="name1" value="name1"> 
 
<input type="checkbox" name="name1" checked> 
 
<br> 
 
<input type="text" name="name2" value="name1"> 
 
<input type="checkbox" name="name2" checked>

Answer 2

ü可以测试上的变化，并找到第一个文本框

$('.test').change(function() { 

    var checkboxINstance = $(this); 
    if (!checkboxINstance.is(":checked")) 
    { 
     checkboxINstance.closest('tr').find("input[type=number]")[0].value= ''; 
    }  
}); 

在此处看到提琴https://jsfiddle.net/2b6e7v6t/1/