我的複選框將不會檢查何時點擊

我有我的表和複選框的另一個問題。我已經得到了我的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

我的複選框將不會檢查何時點擊

回答

相關問題