Jquery代碼如果複選框被選中，選擇所有其他複選框 - 使用Laravel

我有一個小問題，我仍然找不到解決方案。這是關於我認爲的表格，每個表格行都有自己的複選框。還有一個主要複選框應該檢查所有其他複選框，如果我選擇它。Jquery代碼如果複選框被選中，選擇所有其他複選框 - 使用Laravel

我的問題是它不能像我想要的那樣工作。

查看：

// thats the main checkbox, that should select all other checkboxes 

<th><input type="checkbox" class="select-all"/>All</th> 
// and some other non important <th> fields 


all table rows 

       @foreach($products as $product) 
        <tr> 
         <td> 
          // every line checkbox 
          <input type="checkbox" name="id[]" value="{{$product->id}}"> 
         </td> 
         <td>{{ $product->name }}</td> 
         <td>{{ $product->tld }}</td> 
         <td> 
          @foreach($product->tags as $tag) 
           {{$tag->name}}, 
          @endforeach 
         </td> 
         <td>{{ $product->created_at->format('d.m.y') }}</td> 
        </tr> 
       @endforeach

jQuery的

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.select-all').on('click', function() { 
      if(this.checked) { 
       $('.select-all').each(function() { 
        this.checked = true; 
       }); 
      } 
      else { 
       $('.select-all').each(function() { 
        this.checked = false; 
       }); 
      } 
     }); 
    }); 
</script>

jQuery的腳本是好的，如果我添加了「全選」類我<input>標籤內我的foreach循環，並且也是在場外循環，所有複選框被選中。如果我從我的foreach循環內的字段中刪除該類，它不再工作。我現在的問題是，我只想用我的主複選框選擇所有框。目前，我選擇哪個複選框並不重要，每個複選框都將被選中。（所以我沒有選擇單行或兩個選項。

選擇，所有類只是在我的主要複選框輸入字段，而不是在我的輸入框裏面我的foreach循環。

感謝您抽出寶貴的時間和對不起我的英語不好

來源

2016-05-30 WellNo

它看起來像你的jQuery選擇採摘出的子複選框是稍微偏離。嘗試：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.select-all').on('click', function() { 
      var checkAll = this.checked; 
      $('input[type=checkbox]').each(function() { 
       this.checked = checkAll; 
      }); 
     }); 
    }); 
</script>

來源

2016-05-30 12:08:01

這個作品只是完美！！非常感謝你，我仍然在學習jquery :) – WellNo

不客氣:)！儘管值得注意，「input [type = checkbox]」選擇器將選擇頁面上的所有複選框（包括全選選項）。因此，如果您稍後再添加（甚至與表格一起），它們也會被選中/取消選中。建議添加一個像@Anoop這樣的單獨的類將會阻止這一點。 –

謝謝，我會牢記在心:) – WellNo

添加不同類的子複選框。然後你就可以做，

$(".select-all").change(function() { 
    $(".subCheckbox").prop("checked", this.checked); 
});

你並不需要遍歷所有複選框檢查他們。

只需使用類選擇器和prop()方法。

Fiddle

來源

2016-05-30 12:06:04

讓我試試吧:) – WellNo

我看到它的工作原理，但並沒有爲我工作：/但感謝無論如何，下面你的答案幫助我很多:) – WellNo

$(".select-all").change(function() { 
    $(this).closest('table').find('input[type=checkbox]').prop('checked',this.checked);})

來源

2016-05-30 12:50:55

Jquery代碼如果複選框被選中，選擇所有其他複選框 - 使用Laravel

回答

相關問題