Question

我有以下html：

<li class="product_filter input required" id="product_filters_form_sizes_input"><fieldset class="choices"><legend class="label"><label>Sizes</label></legend><input id="product_filters_form_sizes_none" name="product_filters_form[sizes][]" type="hidden" value=""><ol class="choices-group"><li class="choice checked"><label for="product_filters_form_sizes_shortskinny"><input id="product_filters_form_sizes_shortskinny" name="product_filters_form[sizes][]" type="checkbox" value="Short/Skinny"><i class="icon checked-indicator"></i>SHORT/SKINNY</label></li>
  <li class="choice"><label for="product_filters_form_sizes_shortslim"><input id="product_filters_form_sizes_shortslim" name="product_filters_form[sizes][]" type="checkbox" value="Short/Slim"><i class="icon checked-indicator"></i>SHORT/SLIM</label></li>
  <li class="choice"><label for="product_filters_form_sizes_shortathletic"><input id="product_filters_form_sizes_shortathletic" name="product_filters_form[sizes][]" type="checkbox" value="Short/Athletic"><i class="icon checked-indicator"></i>SHORT/ATHLETIC</label></li>
  <li class="choice"><label for="product_filters_form_sizes_shortbroad"><input id="product_filters_form_sizes_shortbroad" name="product_filters_form[sizes][]" type="checkbox" value="Short/Broad"><i class="icon checked-indicator"></i>SHORT/BROAD</label></li>
</li>

默认情况下，我希望选择以下内容，因此我点击使用JS / jQuery：

<li class="choice"><label for="product_filters_form_sizes_shortslim"><input id="product_filters_form_sizes_shortslim" name="product_filters_form[sizes][]" type="checkbox" value="Short/Slim"><i class="icon checked-indicator"></i>SHORT/SLIM</label></li>

我尝试过以下JS：

jQuery(function($){
  $( "#product_filters_form_sizes_shortslim" ).trigger( "click", function(){
  });
});

这有效，但它会进入无限循环，行为如下：

页面加载 - ＆gt;点击被触发 - ＆gt;页面刷新 - ＆gt;点击再次触发 - ＆gt;页面再次刷新，它继续......

添加return false，返回相同的行为。

jQuery(function($){
  $( "#product_filters_form_sizes_shortslim" ).trigger( "click", function(){
    return false;
  });
});

我也尝试过：

jQuery(function($){
  $( "#product_filters_form_sizes_shortslim" ).trigger( "click", function(e){
    e.preventDefault();
    e.stopPropagation();
  });
});

相同的行为，它比前一个稍微加载，但重新加载并进入循环。

也尝试过：

jQuery(function($){
  $( "#product_filters_form_sizes_form_sizes_shortslim" ).click(function{
    return false;
  });
});

除非我这样做，否则会发生：

$( "#product_filters_form_sizes_form_sizes_shortslim" ).click()

相同的无限循环。

点击1i时，它会从<li class="choice">更改为<li class="choice checked">

我在Rails和Spree中使用它，因此不能对HTML进行任何更改。

我一直在努力解决这个问题，所以任何帮助甚至提示如何解决这个问题都会非常感激。

非常感谢!!

触发点击后，JavaScript jQuery阻止刷新进入无限循环

0 个答案: