jQuery-如果值与数组中的元素匹配则禁用复选框

问题描述 投票:0回答:1

我正在尝试在页面加载时禁用复选框,但条件是复选框值与数据库中的记录匹配。

我找到了To disable the selective check box on page load jqueryhttp://jsfiddle.net/R27wq/1/。他和我的处境之间唯一的区别是复选框处于禁用状态。对于他的情况,如果最后一列的值等于1.0,则该复选框将被禁用。

我想做同样的事情,除了我想禁用复选框,如果其值与数据库中的记录匹配。

下面是我的数据库:

my db

和下面是我的复选框中的代码片段:

<td>
   <input type="checkbox" class="seats" name="selected[]" value="A26">
</td>
<td>
   <input type="checkbox" class="seats" name="selected[]" value="A25">
</td>

复选框在网页上看起来像这样:enter image description here

如果复选框值与“保留”列匹配,则应将其禁用。

我如何针对我的情况实施相同的概念?我在想也许我可以将数据库中的值存储在一个数组中,然后从那里,将所有数组元素与所有复选框值进行比较?或者,还有更好的方法?有人可以帮我吗

jquery html mysql checkbox onload
1个回答
0
投票

使用JSFiddle中的代码,只需添加$(this).find("input[type='checkbox']").attr('checked','true');和一个数组以及一个map()forEach()进行检查。

$(function() {
  var reserved = ["A26", "A28"];
  var seats = document.getElementsByClassName('seats');
  for (var i = 0; i < seats.length; i++) {
    reserved.map(function(v) {
      if (seats[i].value === v) {
        seats[i].setAttribute("disabled", "true");
        seats[i].setAttribute("checked", "true");
      }
    });
  }
});
p {
  position: relative;
  top: -35px;
  left: 20px;
}
body {
  width: 500px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" class="seats" name="selected[]" value="A26"><p>A26</p>
<input type="checkbox" class="seats" name="selected[]" value="A27"><p>A27</p>
<input type="checkbox" class="seats" name="selected[]" value="A28"><p>A28</p>
<input type="checkbox" class="seats" name="selected[]" value="A29"><p>A29</p>
© www.soinside.com 2019 - 2024. All rights reserved.