0

所以我的代码中有一些奇怪的行为，我不知道为什么。

我正在使用uniformjs，例如一个复选框是这样的：

<label>Check Boxes</label>
    <div class="input_group">
      <div class="checker"><span><input style="opacity: 0;" name="option" value="option 1" type="checkbox"></span></div>First option<br>
      <div class="checker"><span><input style="opacity: 0;" name="option" value="option 2" type="checkbox"></span></div>Second option<br>
      <div class="checker"><span><input style="opacity: 0;" name="option" value="option 3" type="checkbox"></span></div>Third option
    </div>

因此，当检查选项被选中时，父跨度添加“已检查”类。

所以我试图开发一个系统，用户可以在其中添加用户并在为该用户创建新地址或使用公司地址之间进行选择。

两个地址都加载在不同的 div 中，公司一个被隐藏，所以这就是我所做的功能：

$('input[name="company_addr"]').change(function(){
            var checked = $(this).is(':checked');
            $('input[name="company_addr"]').each(function(){
                $(this).attr('checked',checked);
                if (checked)
                    $(this).parent().addClass('checked');
                else
                    $(this).parent().removeClass('checked');
            });
            if (checked){
                newAddrContent = block_new.html();
                block_new.html(block_company.html());
            }
            else{
                block_new.html(newAddrContent);
            }
        });

如果我删除最后一个 if ... else 并取消隐藏公司地址，我会看到这两项检查如何更改，以便该部分完美运行。

然而，block_new 中的复选框不再起作用，但 block_company 可以。如果我单击该公司（应该隐藏），则另一个不会取消选中或选中，但内容已正确替换。

会发生什么？

4

3 回答 3

0

您使用 check() 这是一次性功能。您必须使用 .live(event, function) 绑定实时事件，以便处理程序处理未来的元素。

所以简单地代替：

$(elements).change();

采用

$(elements).live('change', function() {
...
});
于 2011-09-02T20:49:29.437 回答
0

问题是当您动态创建新事件时input，change事件不会被反弹。您可以使用.delegate Docs解决此问题

$('.input_group').delegate('input[name="company_addr"]', 'change', function(){
             //do your stuff
});

在现场使用委托的原因

于 2011-09-02T20:49:51.417 回答
0

最后似乎是uniformjs的一个错误在这里评论：github.com/pixelmatrix/uniform/issues/180

如果有人对我如何设法解决此问题感兴趣，我只是将方法更改为显示，隐藏正确的 div，因此，在提交表单时，我检查隐藏了哪个 div 并考虑到这一点来处理表单。

于 2011-09-03T10:46:45.823 回答