我的复选框将不会检查何时点击

我有我的表和复选框的另一个问题。我已经得到了我的JavaScript工作，允许我的复选框检查当我点击表格单元格内的任何地方。但是，现在复选框本身不起作用。我试图解决这个问题超过一个小时，无法在任何地方找到答案。这是我的JavaScript和HTML片段被操纵：我的复选框将不会检查何时点击

function tdOnclick(td) { 
    for(var i = 0; i < td.childNodes.length; i++) { 
     if(td.childNodes[i].nodeName == "INPUT") { 
      if(td.childNodes[i].checked) { 
       td.childNodes[i].checked = false; 
       td.style.backgroundColor = "#FAF4E3"; 
      } else { 
       td.childNodes[i].checked = true; 
       td.style.backgroundColor = "#E1E1E1"; 
      } 
     } 
    } 
}

这里是表一块的HTML：

<tr> 
    <td><center>9:00 - 10:00</center></td> 
    <td class="tdata" onclick="tdOnclick(this)"><input type="checkbox" name="free" value="mon09"></td> 
    <td class="tdata" onclick="tdOnclick(this)"><input type="checkbox" name="free" value="tue09"></td> 
    <td class="tdata" onclick="tdOnclick(this)"><input type="checkbox" name="free" value="wed09"></td> 
    <td class="tdata" onclick="tdOnclick(this)"><input type="checkbox" name="free" value="thu09"></td> 
    <td class="tdata" onclick="tdOnclick(this)"><input type="checkbox" name="free" value="fri09"></td> 
</tr>

来源

2012-03-20 cs_irl

我有一些麻烦本来对的jsfiddle复制本，所以这里是一个“工作”链接：http://jsfiddle.net/NKCTn/ – xthexder 2012-03-20 01:20:47

@ Tats_innit - 您的解决方案对我来说不起作用（Linux Mint，Chrome） - 它似乎没有调用该函数......我添加了一个警报http://jsfiddle.net/9tb4W/6/，并且无法实现。然后我将JS切换到标题中，并且该错误再次出现在http://jsfiddle.net/9tb4W/5/中。 – FrankieTheKneeMan 2012-03-20 01:25:40

是的，我已经在jsfiddle上自己尝试过了。我会发布一个链接到我正在测试的位置，这样你就可以看到我的意思了。 http://cs1.ucc.ie/~od1/project_css/ – 2012-03-20 01:26:45

其实，我要去冒险的猜测，这是工作。您的点击正在选中该框，然后onClick事件将取消选中它。这是一个想法：

<input type="checkbox" name="free" value="mon09" onClick="this.checked=!this.checked;">

这有点脏，但它成功地忽略了点击。

Working TinkerBin。

来源

2012-03-20 01:19:48 FrankieTheKneeMan

这对我很有帮助，非常感谢。这会消除我的“双重检查”问题吗？ – 2012-03-20 01:32:50

@OisínDorgan - 从技术上说，它将其升级为三重检查 - 从实际点击中切换一次，从复选框的onClick中选择一个，并从td的onClick中选择一个。就像我说的那样，它很脏，但我无法弄清楚如何使它以另一种方式工作。 – FrankieTheKneeMan 2012-03-20 01:36:40

好的，这会影响在Java程序中传递这些选中的值，并将它们放入数据库中吗？我无法想象它会呢？如果没有，我不介意三重点击。 – 2012-03-20 01:45:11

如果我是一个跳动的人，我会猜测你有一个双击事件。一个用于输入，另一个用于父母。基本上你得到两个点击，有效地禁用你的输入。阅读post。像这样的可能性会起作用。

<input type="checkbox" name="free" value="fri09" onclick="return false;" />

来源

2012-03-20 01:23:55

在Tinkerbin试过。没有骰子 - 更改发生在onClick事件之前。 – FrankieTheKneeMan 2012-03-20 01:28:06

您的点击是按照预期检查复选框，然后调用TD点击代码，您已将您的复选框切换回来。

这是一个jsfiddle，有一些评论显示发生了什么。 http://jsfiddle.net/NujXv/2/

您需要停止将事件从复选框冒泡到TD。我发现这个搜索jquery函数 - http://api.jquery.com/event.stopPropagation。我在jsfiddle中放了一条注释掉的线，但我有真正的jQuery体验，所以你可能需要稍微调整一下。

来源

2012-03-20 01:24:03

谢谢！你解决了我的问题。在复选框单击事件上添加event.stopPropagation（），并且检查完美（模态：D）。 – 2017-05-31 09:03:34

我是有同样的问题：

检查，如果某处呼吁“的preventDefault”，并检查是否为复选框点击函数返回true，如果存在，则之前的preventDefault。

我是这样解决的：

$("#recordlist").click(function(e) { 
    if (e.target.name == 'recordlistitem'){ // When recordlistitem is a checkbox(es) 
     return true; 
    } 
    e.preventDefault(); 
    // other stuff here 
}

来源

2013-02-17 09:26:03 Lyoneel

我的复选框将不会检查何时点击

回答

相关问题