1

我有一个表单设置，它使用 DIV 作为复选框的切换。我有一些 jQuery 代码可以监视 DIV 以进行单击，然后切换类以更改图像。很容易，对吧？

我的一切工作都很好，但是当我使用复选框加上产品选项定价（由我正在使用的表单和购物车的插件决定）时，jQuery 不起作用。

我假设有另一个类，或者与定价结构相关的东西，覆盖了代码，但 DIV 在工作和非工作版本之间看起来是一样的。我对正在发生的事情感到茫然——根据我所看到的，jQuery 应该仍然可以工作。

你可以在这里查看表格：http: //bit.ly/YZBdbc

我已经发布了两个复选框示例，因此您可以看到差异（在“选择您的选项”下）。最上面的一个可以在视觉上按照我的意愿工作，但不添加定价，底部的不切换，但定价有效。叹。

在此先感谢您的帮助！

编辑：这是 jQuery 代码：

jQuery('#cart_option_1').click(function() {
    jQuery(this).toggleClass('active');
});
    jQuery('#cart_option_2').click(function() {
    jQuery(this).toggleClass('active');
});
    jQuery('#cart_option_3').click(function() {
    jQuery(this).toggleClass('active');
});

这是工作块中的 DIV 代码：

<div class='ginput_container'><ul class='gfield_checkbox' id='input_1_25'><li class='gchoice_25_1'><input name='input_25.1' type='checkbox' value='Month-to-Month +$10.00' id='choice_25_1' tabindex='2' /><label for='choice_25_1'><div id="cart_option_1b"></div></label></li>

以及来自非工作块的代码（基本相同）：

<div class='ginput_container'><ul class='gfield_checkbox' id='input_1_26'><li class='gchoice_26_1'><input name='input_26.1' type='checkbox' value='Month-to-month|10' id='choice_26_1' tabindex='5' /><label for='choice_26_1'><div id="cart_option_1"></div></label></li>

4

1 回答 1

0

把它变成一个班级。

<div class="cart_option" id="cart_option_1"></div>

然后将点击事件应用到类。

$('.cart_option').on('click',function(){
    $(this).toggleClass('active');
});

为澄清而编辑：您仍然可以将唯一图像应用于cart_option_1, cart_option_1b, 等等，但点击事件适用于所有人，因为它们都具有关联的类。

于 2013-03-13T15:19:29.627 回答