无法在foreach循环中选中所有其他复选框在php/javascript中选择

我目前在我的cakephp2项目中遇到问题。我想要做的是在选择/取消选中“Select all country”时，使foreach循环中的所有其他复选框处于选中状态并取消选择。我在网上搜索，但我发现很多教程都很困难。一些提示或例子会很棒！我很想听到你的消息。我有下面的代码如下。无法在foreach循环中选中所有其他复选框在php/javascript中选择

<ul> 
    <li> 
    <label> 
     <input type="checkbox"> 
     <span class="checkBoxImage"> 
     <?= $Worldarea['name'] ?>Select all country 
     </span> 
    </label> 
    </li> 
    <? foreach ($Worldarea['world']['data'] as $world) { 
if (empty ($world['count'])) continue; 
$select = array_key_exists($world['id'], $info['query']['area_info']); 
?> 
    <li> 
    <label for="area<?= $world['id'] ?>" alt="<?= $world['area_name'] ?>" 
      <?= ($select) ? 'class="selected"' : '' ?>> 
    <input type="checkbox" name="area" value="<?= $world['id'] ?>" id="area<?= $world['id'] ?>" 
      <?= ($sel) ? 'checked="checked"' : '' ?>> 
    <span class="checkBoxImage"> 
     <?= $world['name_display'] ?> 
    </span> 
    </label> 
</li> 
<? } ?> 
</ul>

我认为我应该在javascript方面做下面的事情，但是我发现JS中的初学者很难实现JS方面。

$(this).parents().eq(1).next().find('li input').each(function(){ 
     $(this).prop('checked',''); 
     $(this).next().removeClass('selected'); 
     $(this).parent().css('background', 'none'); 
});

来源

2017-10-10 Tony

你应该张贴生成的HTML的而不是PHP。 – jeroen

@ jeroen是对的。下一次您需要javascript帮助时，无需发布PHP ...由此产生的html将更容易帮助您。 – Salketer

我已经改变了你提供的，可以很容易通过删除PHP和使它看起来像生成的HTML遵循HTML部分。由于你的PHP没有问题。

首先，我在您的复选框中添加了一个应选择全部的ID。这样我可以附加一个事件（onChange）来检测何时被检查或未选中。在这种情况下，我会找到同一列表中的所有复选框，并根据选择全部框的当前值将它们应用到checked属性中。

$("#checkall").change(function() { 
 
    var is_check = $(this).prop('checked'); 
 
    $(this).closest('ul').find('input[type=checkbox]').prop('checked', is_check); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li> 
 
    <label> 
 
     <input type="checkbox" id="checkall"> 
 
     <span class="checkBoxImage"> 
 
     <?= $Worldarea['name'] ?>Select all country 
 
     </span> 
 
    </label> 
 
    </li> 
 

 
    <li> 
 
    <label for="area1"> 
 
    <input type="checkbox" name="area" value="1" id="area1"> 
 
    <span class="checkBoxImage"> 
 
     Country name 
 
    </span> 
 
    </label> 
 
    </li> 
 
    <li> 
 
    <label for="area2"> 
 
    <input type="checkbox" name="area" value="2" id="area2"> 
 
    <span class="checkBoxImage"> 
 
     Country name 
 
    </span> 
 
    </label> 
 
    </li> 
 
    <li> 
 
    <label for="area3"> 
 
    <input type="checkbox" name="area" value="3" id="area3"> 
 
    <span class="checkBoxImage"> 
 
     Country name 
 
    </span> 
 
    </label> 
 
    </li> 
 
    <li> 
 
    <label for="area4"> 
 
    <input type="checkbox" name="area" value="4" id="area4"> 
 
    <span class="checkBoxImage"> 
 
     Country name 
 
    </span> 
 
    </label> 
 
    </li> 
 

 
</ul>

来源

2017-10-10 09:14:33 Salketer

首先，您需要将“id”属性添加到“全选”复选框。在这个例子中，我使用了“checkbox-ALL”。
之后，你应该改变你的复选框名称。而不是“名称”，使用“名称[]”来创建一个复选框数组。
之后，你可以这样做：

jQuery('#checkbox-ALL').on('click', function() { 
    jQuery("input[name*=area]").prop('checked', this.checked); 
});

来源

2017-10-10 09:12:44

无法在foreach循环中选中所有其他复选框在php/javascript中选择

回答

相关问题