gpt4 book ai didi

javascript - 根据选择选择一些复选框

转载 作者:行者123 更新时间:2023-12-03 00:08:23 25 4
gpt4 key购买 nike

我有三个复选框按钮。我希望它的功能是这样的,当我单击全选时,所有复选框都要被选中,当我单击检查公司时,只有公司需要被选中,当我选择自由职业者时,只有自由职业者复选框要被选中。

现在第一个复选框工作正常,所有复选框都被选中和取消选中,但其他两个复选框不起作用。

$('#check_all').on("click", function(){
var cbxs = $('input[type="checkbox"]');
cbxs.prop("checked", !cbxs.prop("checked"));
});


$('#mycompanies').click(function(){
var select_all = (this.value === 'Select All');
$('input:checkbox').attr('checked', select_all);
this.value = (select_all) ? 'Deselect All' : 'Select All';
});
$('#myfreelancers').click(function(){
var select_all = (this.value === 'Select All');
$('input:checkbox').attr('checked', select_all);
this.value = (select_all) ? 'Deselect All' : 'Select All';
});
<button type="button" id="check_all" class="btw">Check all/Uncheck all</button>
<button type="button" id="mycompanies" class="mycompanies">Check all companies</button>
<button type="button" id="myfreelancers" class="myfreelancers">Check all freelancers</button>

这是我为自由职业者准备的复选框标签:

 <% @m_freelancers.each do |freelancer| %>
<tr>
<td><%=check_box_tag 'selected_freelancers[]', freelancer.id%>

<td><%= freelancer.email %></td>
<tr/>
<% end %>

公司复选框:

<% @m_companies.each do |company| %>
<tr>
<td><%=check_box_tag 'selected_companies[]', company.id%></td>

<td><%= company.user.email %></td>

</tr>
<% end %>

最佳答案

使用选择器[name="myElementName"]按名称查找元素,并相应地检查它们。由于您的元素是 HTML“数组”([]),因此您还需要将其包含在选择器中。

您可能需要考虑使用一个类来代替,可能会更干净一些 - 但这个选择器就可以了。

// Check all if all is unchecked - remove all checks if one or more is checked
$('#check_all').on("click", function(){
var cbxs = $('input[type="checkbox"]');
cbxs.prop("checked", !cbxs.prop("checked"));
});

$("#mycompanies").on("click", function() {
var companyCheckboxes = $('[name="companies[]"]');
companyCheckboxes.prop("checked", true);
});

$("#myfreelancers").on("click", function() {
var freelancerCheckboxes = $('[name="freelancers[]"]');
freelancerCheckboxes.prop("checked", true);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button type="button" id="check_all" class="btw">Check all/Uncheck all</button>
<button type="button" id="mycompanies" class="mycompanies">Check all companies</button>
<button type="button" id="myfreelancers" class="myfreelancers">Check all freelancers</button>
<br />
<br />

<input type="checkbox" name="freelancers[]" /> Freelance 1<br />
<input type="checkbox" name="freelancers[]" /> Freelance 2<br />
<input type="checkbox" name="freelancers[]" /> Freelance 3<br />
<input type="checkbox" name="freelancers[]" /> Freelance 4<br />


<input type="checkbox" name="companies[]" /> Company 1<br />
<input type="checkbox" name="companies[]" /> Company 2<br />
<input type="checkbox" name="companies[]" /> Company 3<br />
<input type="checkbox" name="companies[]" /> Company 4

关于javascript - 根据选择选择一些复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54860600/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com