Checbox限制器禁用问题 [英] Checbox Limiter disabled problems

问题描述

<input type="checkbox" value="1" name="malzeme1[]" checked="" disabled="" id="checkboxExample1" onclick="checkNumChecked(this, 2)">
<label for="checkboxExample1">Soğan<b class="product-subtitlex"> | + 1 ₺</b>
</label>
<input type="checkbox" value="3" name="malzeme1[]" id="checkboxExample3" onclick="checkNumChecked(this, 2)">
<label for="checkboxExample3">Soğanx<b class="product-subtitlex"> | + 1 ₺</b>
</label>

<input type="checkbox" value="4" name="malzeme1[]" id="checkboxExample4" onclick="checkNumChecked(this, 2)">
<label for="checkboxExample4">Soğanc<b class="product-subtitlex"> | + 1 ₺</b>
</label>

<input type="checkbox" value="5" name="malzeme1[]" id="checkboxExample5" onclick="checkNumChecked(this, 2)">
<label for="checkboxExample5">Soğanxc<b class="product-subtitlex"> | + 1 ₺</b>
</label>

<script>
  function checkNumChecked(ele, limit) {
    var ct = 0,
      siblings = document.getElementsByName(ele.name),
      checked = 0;
    for (ct = 0; ct <= siblings.length - 1; ct++) {
      checked += (siblings[ct].checked) ? 1 : 0
    }
    for (ct = 0; ct <= siblings.length - 1; ct++) {
      siblings[ct].disabled = siblings[ct].checked ? false : (checked == limit) ? true : false
    }
  }
</script>

这是我的复选框限制器。例如，当我选择2复选框时，其他复选框将禁用。但这里有一个问题，当我取消选中1复选框forexample。它会删除原来disabled =复选框。它不必删除原始的disabled =代码

This is mine Checkbox Limiter. For example it ll other checkboxes going disabled when I pick 2 checkbox. But there is a problem here when I after uncheck 1 checkbox forexample. It will remove original disabled="" checkbox too. It dont have to remove original disabled="" code

推荐答案

我在这里做了为了永久禁用复选框你想让代码离开是使用自定义数据属性data-permdisable。这告诉代码跳过对元素进行任何更改。

What I have done here in order to permanently disable the check box you want the code to leave alone is to use a custom data attribute "data-permdisable". This tells the code to skip making any changes to the element.

此外，我应该指出，您应该已经check =checked和disabled =disabled a form of form。

Also, I should point out that you should have checked="checked" and disabled="disabled" as a matter of form.

<input type="checkbox" value="1" name="malzeme1[]" checked="checked" disabled="disabled" id="checkboxExample1"
    onclick="checkNumChecked(this, 2)" data-permdisable="true">
<label for="checkboxExample1">
    Soğan<b class="product-subtitlex"> | + 1 ₺</b>
</label>
<input type="checkbox" value="3" name="malzeme1[]" id="checkboxExample3" onclick="checkNumChecked(this, 2)">
<label for="checkboxExample3">
    Soğanx<b class="product-subtitlex"> | + 1 ₺</b>
</label>
<input type="checkbox" value="4" name="malzeme1[]" id="checkboxExample4" onclick="checkNumChecked(this, 2)">
<label for="checkboxExample4">
    Soğanc<b class="product-subtitlex"> | + 1 ₺</b>
</label>
<input type="checkbox" value="5" name="malzeme1[]" id="checkboxExample5" onclick="checkNumChecked(this, 2)">
<label for="checkboxExample5">
    Soğanxc<b class="product-subtitlex"> | + 1 ₺</b>
</label>
<script>
    function checkNumChecked(ele, limit) {
      var ct = 0,
      siblings = document.getElementsByName(ele.name),
      checked = 0;
        for (ct = 0; ct <= siblings.length - 1; ct++) {
            checked += ((siblings[ct].getAttribute("data-permdisable") == "true") ? 0 : ((siblings[ct].checked) ? 1 : 0))
        }
        for (ct = 0; ct <= siblings.length - 1; ct++) {
            siblings[ct].disabled = (siblings[ct].getAttribute("data-permdisable") == "true") ? 
                siblings[ct].disabled : siblings[ct].checked ? false : (checked == limit) ? true : false
        }
    }
</script> 

这篇关于Checbox限制器禁用问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！