我有一組複選框，其中包含'無'作爲選項。如果點擊「無」，則複選框集的其餘部分應該被取消點擊。如果點擊了其中一個或多個其他設備，則應取消選中「無」。以下在IE8中的作品。它在FF3.6.11中默默無聞。我該如何解決它？我的jQuery功能在IE8中工作，但不是FF3.6.11。爲什麼？

的JavaScript

// go through <table class='checktoggle'> and add the click event "checkToggle" 
// to all the <input type='checkbox'>s 
$(document).ready(function() { 
    $("table.checktoggle").find('input:checkbox').click(checkToggle); 
}); 

function checkToggle(event) { 
    var cur_chkbox=$(event.target); 
    if (cur_chkbox.val()==0) { //if clicked "None", uncheck the rest of the set 
     $("input:checkbox[name^="+cur_chkbox.attr('name')+"]").filter(function(value){ return value!=0;}).attr('checked',false); 
    } else { //else unclick "None" 
     $("input:checkbox[name^="+cur_chkbox.attr('name')+"]").filter(function(value){ return value==0;}).attr('checked',false); 
    } 
}

HTML

<table id="perm_table" class="checktoggle"> 
    <tr > 
     <th>Permission</th> 
     <th>none</th> 
     <th>view</th> 
     <th>use</th> 
     <th>add</th> 
     <th>edit</th> 
     <th>delete</th> 

    </tr> 
    <tr> 
     <td>location</td><td><input type='checkbox' name='location[]' id='location0' value='0'/></td> 
     <td><input type='checkbox' name='location[]' id='location1' value='1' checked="yes" /></td> 
     <td><input type='checkbox' name='location[]' id='location2' value='2'/></td> 
     <td><input type='checkbox' name='location[]' id='location4' value='4'/></td> 
     <td><input type='checkbox' name='location[]' id='location8' value='8'/></td> 
     <td><input type='checkbox' name='location[]' id='location16' value='16'/></td> 
</tr> 
<tr> 
     <td>watersystem</td><td><input type='checkbox' name='watersystem[]' id='watersystem0' value='0' /> 
     <td><input type='checkbox' name='watersystem[]' id='watersystem1' value='1' checked="yes"/></td> 
     <td><input type='checkbox' name='watersystem[]' id='watersystem2' value='2'/></td> 
     <td><input type='checkbox' name='watersystem[]' id='watersystem4' value='4'/></td> 
     <td><input type='checkbox' name='watersystem[]' id='watersystem8' value='8'/></td> 
     <td><input type='checkbox' name='watersystem[]' id='watersystem16' value='16'/></td> 
</table>

來源

2010-12-09 dnagirl

在線試玩：http://www.jsfiddle.net/4KW2V/我這樣做，和Safari在`VAR cur_chkbox = $（event.target）拋出一個錯誤;`如下：` TypeError：表達式'event'的結果[undefined]不是一個對象。' – eykanal 2010-12-09 20:13:50

的問題是由方括號中的名稱屬性中強制。

嘗試將此作爲選擇：

$("input:checkbox[name^='"+cur_chkbox.attr('name')+"']")

（周圍的屬性值的單引號賺取差價）

來源

2010-12-09 20:39:19

更改功能如下：

function checkToggle() { 
    var cur_chkbox=$(this); 
    if (cur_chkbox.val()==0) { //if clicked "None", uncheck the rest of the set 
     $("input:checkbox[name^='"+cur_chkbox.attr('name')+"']").filter(function(value){ return value!=0;}).attr('checked',false); 
    } else { //else unclick "None" 
     $("input:checkbox[name^='"+cur_chkbox.attr('name')+"']").filter(function(value){ return value==0;}).attr('checked',false); 
    } 
}

點擊，由於某種原因，沒有發送活動，所以我們可以使用$(this)而不是$(event.target)。

另外，您的選擇器需要根據Dr. Molle的解決方案進行更改。

jsFiddle

來源

2010-12-09 20:45:52

我的jQuery功能在IE8中工作，但不是FF3.6.11。爲什麼？

的JavaScript

HTML

回答

相關問題