一次一个复选框JavaScript

时间:2017-08-06 14:42:41

标签: javascript checkbox

首先我要说的是,我看到了非常相似的问题,是的;我已阅读并尝试实施建议的解决方案。我试图让它一次只能选择一行中的一个复选框。我见过的最常见的答案就是这个;

$('input.example').on('change', function() {
  $('input.example').not(this).prop('checked', false);  
});

这个解决方案对我有用,但那是在我动态创建表之前。这是我目前的代码。它通过JSON $ .post。

从MySQL表中提取表数据
function load() {
  $.post(
    "Returnsmedb.php",
    function(response) {
      var block = []
      index = 0;
      for (var item in response) {
        var objectItem = response[item];
        var firstname = objectItem.fname;
        var lastname = objectItem.lname;
        var username = objectItem.uname;
        var email = objectItem.email;
        var password = objectItem.password;
        var deny = document.createElement("input");
        deny.type = "checkbox";
        deny.className = "chk";
        deny.name = "deny";
        deny.id = "deny";
        var approve = document.createElement("input");
        approve.type = "checkbox";
        approve.className = "chk";
        approve.name = "approve";
        var moreinfo = document.createElement("input");
        moreinfo.type = "checkbox";
        moreinfo.className = "chk";
        moreinfo.name = "moreinfo";

        block.push(firstname);
        block.push(lastname);
        block.push(username);
        block.push(email);
        block.push(password);
        block.push(deny);
        block.push(approve);
        block.push(moreinfo);

        dataset.push(block);
        block = [];
      }

      var data = [" First Name", " Last Name ", " User Name ", " Email ", "Password", " Deny", "Approve", "More Information"]

      tablearea = document.getElementById('usersTable');
      table = document.createElement('table');
      thead = document.createElement('thead');
      tr = document.createElement('tr');

      for (var i = 0; i < data.length; i++) {
        var headerTxt = document.createTextNode(data[i]);
        th = document.createElement('th');
        th.appendChild(headerTxt);
        tr.appendChild(th);
        thead.appendChild(tr);
      }

      table.appendChild(thead);


      for (var i = 0; i < dataset.length; i++) {
        tr = document.createElement('tr');
        tr.appendChild(document.createElement('td'));
        tr.appendChild(document.createElement('td'));
        tr.appendChild(document.createElement('td'));
        tr.appendChild(document.createElement('td'));
        tr.appendChild(document.createElement('td'));
        tr.appendChild(document.createElement('td')); //Added for checkbox
        tr.appendChild(document.createElement('td')); //Added for checkbox
        tr.appendChild(document.createElement('td')); //Added for checkbox


        tr.cells[0].appendChild(document.createTextNode(dataset[i][0]));
        tr.cells[1].appendChild(document.createTextNode(dataset[i][1]));
        tr.cells[2].appendChild(document.createTextNode(dataset[i][2]));
        tr.cells[3].appendChild(document.createTextNode(dataset[i][3]));
        tr.cells[4].appendChild(document.createTextNode(dataset[i][4]));
        tr.cells[5].appendChild((dataset[i][5])); //
        tr.cells[6].appendChild((dataset[i][6])); //
        tr.cells[7].appendChild((dataset[i][7])); //
        table.appendChild(tr);
      }

      tablearea.appendChild(table);
    }, 'json'
  );
}

我尝试在各个方面粘贴常见的解决方案,但我仍然无法让它工作。任何帮助将不胜感激。

谢谢!

1 个答案:

答案 0 :(得分:1)

请尝试此代码

    $('input.chk').on('change', function() {
if($('this:checked'))
{
    var tr =$(this).parents('tr');
tr.find("input.chk").not(this).each(function(){
$(this).prop('checked', false);
});
}

});