在@Joseph的帮助下,我设法创建了这个脚本,它完全按照我想要的方式在jsfiddle上运行。但是,当我在我的网页上使用完全相同的脚本时它没有做任何事情,它忽略了if和else中的脚本,并且像普通的单选按钮那样工作。我没有收到任何错误消息,我正在使用:
http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js
http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js
我唯一能想到的是它使用“this”不起作用?我该如何解决?
我的脚本可以在以下位置找到:
http://jsfiddle.net/pJgyu/15013/
jQuery(document).ready(function ()
{
$("input[type='radio']").click(function(){
var $knapp = $(this).val();
if(($knapp=='1c') || ($knapp=='2c')|| ($knapp=='3c')) {
this.checked = true;
}else{
$("input[type='radio']."+this.className).not($(this)).each(function(){
this.checked = false;
});
}
});
});
<table>
<tr>
<td>1</td>
<td><input type="radio" class="ljudkalla_1" name="ljudkalla_1" value="1a"></td>
<td><input type="radio" class="ljudkalla_2" name="ljudkalla_1" value="1b"></td>
<td><input type="radio" class="ljudkalla_3" name="ljudkalla_1" value="1c"></td>
</tr>
<tr>
<td>2</td>
<td><input type="radio" class="ljudkalla_1" name="ljudkalla_2" value="2a"></td>
<td><input type="radio" class="ljudkalla_2" name="ljudkalla_2" value="2b"></td>
<td><input type="radio" class="ljudkalla_3" name="ljudkalla_2" value="2c"></td>
</tr>
<tr>
<td>3</td>
<td><input type="radio" class="ljudkalla_1" name="ljudkalla_3" value="3a"></td>
<td><input type="radio" class="ljudkalla_2" name="ljudkalla_3" value="3b"></td>
<td><input type="radio" class="ljudkalla_3" name="ljudkalla_3" value="3c"></td>
</tr>
</table>
答案 0 :(得分:1)
你包括jQuery两次。一个是minified版本,由min.js
表示。您只需要其中一个库。我建议使用缩小版本来节省带宽。
答案 1 :(得分:1)
这似乎是HTML中的一个错误,因为它可以在本地从头开始创建HTML。
您还可以尝试使用Firebug或Safari或Chrome的调试程序调试您的版本。在代码中放置一个断点,在控制台中手动尝试jQuery选择器可以帮助发现大多数问题。
这个有效:
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ()
{
$("input[type='radio']").click(function(){
var $knapp = $(this).val();
if(($knapp=='1c') || ($knapp=='2c')|| ($knapp=='3c')) {
this.checked = true;
}else{
$("input[type='radio']."+this.className).not($(this)).each(function(){
this.checked = false;
});
}
});
});
</script>
</head>
<body>
<table>
<tr>
<td>1</td>
<td><input type="radio" class="ljudkalla_1" name="ljudkalla_1" value="1a"></td>
<td><input type="radio" class="ljudkalla_2" name="ljudkalla_1" value="1b"></td>
<td><input type="radio" class="ljudkalla_3" name="ljudkalla_1" value="1c"></td>
</tr>
<tr>
<td>2</td>
<td><input type="radio" class="ljudkalla_1" name="ljudkalla_2" value="2a"></td>
<td><input type="radio" class="ljudkalla_2" name="ljudkalla_2" value="2b"></td>
<td><input type="radio" class="ljudkalla_3" name="ljudkalla_2" value="2c"></td>
</tr>
<tr>
<td>3</td>
<td><input type="radio" class="ljudkalla_1" name="ljudkalla_3" value="3a"></td>
<td><input type="radio" class="ljudkalla_2" name="ljudkalla_3" value="3b"></td>
<td><input type="radio" class="ljudkalla_3" name="ljudkalla_3" value="3c"></td>
</tr>
</table>
</body>
</html>
答案 2 :(得分:0)
我认为this就是你所追求的,对吗?这适用于您的本地计算机吗?
$("input").click(function() {
if (this.className.indexOf('3') === -1) {
$("input." + this.className).not($(this)).each(function() {
this.checked = false;
});
}
});