Question

我继承了一个程序错误的网站。它碰巧使用jQuery v2.1.3（对此我没有一般的抱怨）。在页面上，我放置了一个选择下拉列表。当用户更改此列表中的选择时，页面将刷新。

在Chrome开发人员工具中，更改事件侦听器结果是从我看到的加载的通用jQuery库中的一行。事件处理程序是这样的：

if ( !(eventHandle = elemData.handle) ) {
    eventHandle = elemData.handle = function( e ) {
        // Discard the second event of a jQuery.event.trigger() and
        // when an event is called after a page has unloaded
        return typeof jQuery !== strundefined && jQuery.event.triggered !== e.type ?
            jQuery.event.dispatch.apply( elem, arguments ) : undefined;
    };
}

目前还没有连接到这个领域的JavaScript（除了因为它只是出现在页面中而被锁定的东西）。

我的问题是如何防止这种情况发生。我不希望每当选择列表发生更改时刷新页面，只是因为加载了jQuery。

ETA：根据以下@theAnubhav的建议，我已将输出的HTML更新到下面，但页面仍然会在更改时刷新：

<div class="field"><select id="field4860fb3b7d994e8d964fc71b24e32752">
  <option value=""></option>
  <option value="AF">Afghanistan</option>
  <option value="AL">Albania</option>
  <option value="DZ">Algeria</option>
  <option value="AD">Andorra</option>
  <option value="AO">Angola</option>
  <option value="AR">Argentina</option>
  <option value="AM">Armenia</option>
  <option value="AU">Australia</option>
  <option value="AT">Austria</option>
  <option value="AZ">Azerbaijan</option>
  <option value="BS">Bahamas</option>
  <option value="BH">Bahrain</option>
  <option value="BD">Bangladesh</option>
  <option value="FR">France</option>
  <option value="DE">Germany</option>
  <option value="US">United States</option>
</select>
<script>$('#field4860fb3b7d994e8d964fc71b24e32752').on('change',function(e){ e.stopPropogation(); });</script>
</div>

Answer 1

您需要使用其他自定义事件覆盖此事件，以防止您的下拉列表执行此事件。您需要在此下拉列表的事件处理程序中使用event.stopPropogation / event.stopImmediatePropogation，像，

$('#mycustomdropdown').on('change',function(e){
    /* some more custom code */
    e.stopPropogation();
});

event.stopPropagation（）方法停止将事件冒泡到父元素，从而阻止执行任何父事件处理程序。

停止jQuery自动刷新SELECT选项更改页面

1 个答案: