0

不知道如何做到这一点......但这就是我想要做的：

我有一系列单选框

<div id="xrowcont_0">
    <input type="radio" name="13_641" value="a" id="13_641_form_a" ><label for="13_641_form_a"><span></span></label>
    <input type="radio" name="13_641" value="b" id="13_641_form_b" checked="checked"><label for="13_641_form_b"><span></span></label>
    <div id="xmod_mach_list_0" style="display:none;">BOO1</div>
</div>

<div id="xrowcont_1">
    <input type="radio" name="13_642" value="a" id="13_642_form_a"><label for="13_642_form_a"><span></span></label>
    <input type="radio" name="13_642" value="b" id="13_642_form_b"><label for="13_642_form_b"><span></span></label>
    <div id="xmod_mach_list_1" style="display:none;">BOO2</div>
</div>

... ++++

这个想法是，当您在 中选择单选框“B”时<div id="xrowcont_0">，它会<div id="xmod_mach_list_1"在每一行旁边取消隐藏。

这是js：

假设我们有 13 行...

for (var i=0;i<13;i++) {    
    var a1 = "'#xrowcont_" + [i] + " input[type=radio]'";
    var a2 = "'#xrowcont_" + [i] + " input:checked'";

    console.log(a1);
    console.log(a2); // these show up just fine.

    $(a1).on( "click", function() { // but here it breaks.
        var state = $(a2).val();
        if (state == "b") {
            $('#xmod_mach_list_' + [i] ).css('opacity',0).show().animate({ opacity: 1 }, 300);
            console.log("Show Button");

        } else { 
            $('#xmod_mach_list_' + [i] ).animate({ opacity: 0} , 200);
            setTimeout(function () {$('#xmod_mach_list_' + [i] ).hide(); }, 200); 
            console.log("Hide Button");
        };    
    });
}

它给了我Uncaught Error: Syntax error, unrecognized expression: '#xrowcont_0 input[type=radio]'，尽管那是我想要在... $(a1).on( "click", function() {...等部分中填充的内容。

我怎样才能解决这个问题？

4

2 回答 2

5

拆下括号。是一个包含作为其唯一项[i]的数组。i

您还应该注意，由于闭包的魔力，使用iin a会导致问题。setTimeout考虑像这样形成你的循环：

for(i ......) { (function(i) {
    ...
})(i); }
于 2013-06-12T14:29:16.267 回答
2

问题是您的字符串a1是a2无效的 jQuery 选择器。与您认为您不希望它们的值包含单引号的情况相反，因此请将它们取出。

它应该是：

var a1 = "#xrowcont_" + [i] + " input[type=radio]";
var a2 = "#xrowcont_" + [i] + " input:checked";

你不会这样做：

$("'#xrowcont_0 input[type=radio]'").on(...);

使用 jQuery 时，因此在将选择器声明为单独的变量时也不应该将它们放在字符串中。选择器本身不是'#foo'，而是#foo. 单引号或双引号仅用于表示在传递给 jQuery 对象时它是一个字符串——尽管您的变量已经是字符串。

该代码有一个单独的、不相关的问题与for循环有关。您正在使用事件处理程序和 延迟执行某些代码setTimeout，但您在该函数中使用i（循环的索引变量）。for由于变量在 JavaScript 中的作用域的方式，延迟执行将使用循环i的最后一次迭代的值。

为了解决这个问题，您需要使用立即调用的函数表达式创建一个新的闭包（变量的新范围）：

for(var i = 0; i < 13; i++) {
    (function(i) {
        // i here is a different variable to i outside
        // it's passed, and maintains, the value for this iteration of the loop
        ... // your loop code
    })(i);
}
于 2013-06-12T14:40:01.150 回答