Fatal编程技术网
  • javascript/
  • Javascript 使用输入值作为id切换问题

Javascript 使用输入值作为id切换问题

javascript jquery

Javascript 使用输入值作为id切换问题,javascript,jquery,toggle,Javascript,Jquery,Toggle,我试图使用jQuery的.toggle（）来显示和隐藏三个div中的一个。div具有唯一的id，切换哪个div取决于选择了三个单选按钮中的哪一个。这三个单选按钮的值与div的id相对应。因此，如果有人单击-1收音机，id为cMB\u 0292\u A07.m1的div应该被切换 然而，我并没有得到任何响应，也并没有关于我尝试过的调试器中的任何错误的报告。怎么了 <!DOCTYPE html> <html> <head> <script src="

我试图使用jQuery的
.toggle（）
来显示和隐藏三个div中的一个。div具有唯一的id，切换哪个div取决于选择了三个单选按钮中的哪一个。这三个单选按钮的值与div的id相对应。因此，如果有人单击-1收音机，id为
cMB\u 0292\u A07.m1
的div应该被切换

然而，我并没有得到任何响应，也并没有关于我尝试过的调试器中的任何错误的报告。怎么了

<!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script>
        function showdiv(obj) {
            var n = obj.name;
            var v = $("input:radio[name='" + n + "']:checked").val();
            alert(v);
            $("#" + v).toggle();
        }
    </script>
</head>
<body>
    <input name="cMB_0292_A07" value="cMB_0292_A07.m1" onclick="showdiv(this);" type="radio">-1
    <input name="cMB_0292_A07" value="cMB_0292_A07.0" onclick="showdiv(this);" type="radio">0
    <input name="cMB_0292_A07" value="cMB_0292_A07.p1" onclick="showdiv(this);" type="radio">+1
    <div id="cMB_0292_A07.m1" style="display: none">minus1</div>
    <div id="cMB_0292_A07.0" style="display: none">zero</div>
    <div id="cMB_0292_A07.p1" style="display: none">plus1</div>
</body>
</html>


函数showdiv（obj）{
var n=对象名称；
var v=$（“输入：radio[name='”+n+']：选中”）.val（）；
警戒（五）；
$（“#”+v）.toggle（）；
}
-1
0
+1
缺点1
零
加号1
这实际上是一个由两部分组成的问题

首先，您不应该在IDs中使用

其次，jQuery看到了这一点：
$（'#ID.CLASS'）
它在DOM中搜索ID:
cMB\u 0292\u A07
然后是
m1
的子类

您可以通过删除id中的句点或使用正则表达式选择器
[id=”“]
来修复此问题

其他旁注，不要使用
onClick
events。最好将业务逻辑和表示逻辑分开。使用jQuery
.on（'click'，function（）{}）事件
 您不能使用
，因为它将使用类
m1
或
0
或
p1
查找其子级

请查看以下代码段：



$（文档）.ready（函数（）{
$（“输入[type='radio']）。单击（函数（）{
警报（$（“#”+$（this.val（））.length）；
});
});


-1
0
+1
缺点1
零

plus1不仅内联JS
onclick
已经过时，
var n=obj.name；var v=$（“输入：radio[name='”+n+']：选中”）.val（）
是冗余代码（而不是简单的
var v=obj.value；
）。我花了四个小时试图弄明白这一点。当然ID是根据文件名生成的，这就是为什么它们有。在他们里面。非常感谢@mcpdesnsthanks@Regent我现在已经更改了。顺便说一句，应该用什么来代替
onclick
？给这些单选按钮一个
类
。并在（'click'，function（）{/*code here*/}）上创建一个click事件（在您的document.ready中）
$（'yourRadioButtonsClass'） $('[id="' + v + '"]').toggle();