0

我在 5 个输入和一个下拉列表的末尾有一个复选框。我正在尝试通过 jquery 将复选框之前的所有输入和下拉列表设置为 0。

将列出许多员工,因此只能是复选框之前的员工。

我对 jquery 的微弱尝试。我有 .on 因为有时它会通过 ajax 调用

$(document).ready(function () {

    $(document).on('click', '.fasCheck', function(){

    if ($(this).attr("checked") == "checked"){
        $(this).prev().parent().prev(".payWeek").next('input').prop('checked', true);;
    } else {

    }
    });     

});

的HTML:

<div class="returns" id="employee">
<h3>David Wilson</h3>
<div class="payWeek">
        <label for="MonthlyReturn0PayWeek1">Pay Week1</label>
        <input type="number" id="MonthlyReturn0PayWeek1" value="" maxlength="12" step="any" name="data[MonthlyReturn][0][pay_week1]">
    </div>
   <div class="payWeek">
        <label for="MonthlyReturn0PayWeek2">Pay Week2</label>
        <input type="number" id="MonthlyReturn0PayWeek2" value="" maxlength="12" step="any" name="data[MonthlyReturn][0][pay_week2]">
   </div>
   <div class="payWeek">
        <label for="MonthlyReturn0PayWeek3">Pay Week3</label>
        <input type="number" id="MonthlyReturn0PayWeek3" value="" maxlength="12" step="any" name="data[MonthlyReturn][0][pay_week3]">
   </div>
   <div class="payWeek">
        <label for="MonthlyReturn0PayWeek4">Pay Week4</label>
        <input type="number" id="MonthlyReturn0PayWeek4" value="" maxlength="12" step="any" name="data[MonthlyReturn][0][pay_week4]">
    </div>
    <div class="payWeek">
         <label for="MonthlyReturn0PayWeek5">Pay Week5</label>
         <input type="number" id="MonthlyReturn0PayWeek5" value="" maxlength="12" step="any" name="data[MonthlyReturn][0][pay_week5]">
     </div>
     <div class="payWeek">
          <label for="MonthlyReturn0PayWeeks">Pay Weeks</label>
          <select id="MonthlyReturn0PayWeeks" name="data[MonthlyReturn][0][pay_weeks]">
                <option value="0">0</option>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option selected="selected" value="4">4</option>
                <option value="5">5</option>
           </select>
      </div>                        
      <div class="payWeek">
           <label for="FAS">FAS</label>
           <input type="checkbox" class="fasCheck" name="FAS">
      </div>
</div>
4

3 回答 3

1
  • $(this).attr("checked") == "checked"行不通,你已经知道使用.prop(). 或者只使用this.cecked没有任何 jQuery。
  • .prev().parent()-prev绝对没有必要,所有兄弟姐妹都有相同的父节点。
  • .prev(".payWeek")- 好像你想.prevAll()改用。
  • .next('input')- 你不想找到下一个兄弟姐妹,而是一个后代。使用.children().find()
  • .prop('checked')- 虽然适用于复选框,但您在这里有数字输入,需要value通过.val().

所以改成

$(document).ready(function() {
    $(document).on('click', '.fasCheck', function() {
        if (this.checked) {
            $(this)
              .parent()
              .prevAll(".payWeek")
              .find('input')
              .val('0');
        }
    });     
});
于 2013-02-19T16:43:26.583 回答
1

从单击的复选框中,找到最接近的payWeek,然后选择所有先前payWeeks的 ,并找到其中的所有输入payWeeks并将值设置为零:

$(document).ready(function () {
    $(document).on('click', '.fasCheck', function(){
        if ( this.checked ) {
            $(this).closest('.payWeek')
                   .prevAll('.payWeek')
                   .find('input')
                   .val('0');
        } else {

        }
    });     
});
于 2013-02-19T16:44:03.463 回答
1
$(document).on('click', '.fasCheck', function(){

    var $this = $(this),
        $parent = $(this).parents('.returns').eq(0),
        $inputs = $parent.find('input');

    if ($this.prop("checked")){
        $inputs.val('0');
    } 
});
于 2013-02-19T16:45:20.890 回答