"on“preventDefault

Question

我在这里错过了什么？

请注意:使用jQuery移动电话

• 使用preventDefault演示
• 使用返回假的演示

如果我使用preventDefault加载页面，就好像我只有链接而没有脚本一样，当我更改为返回false (我通常在普通的JS onclick事件处理程序上使用)时，它会正常工作。我已经浏览过其他帖子，并且都使用.click，并且都建议使用preventDefault。

$(document).ready(function() {
  $("#leftdiv a").on("click",function(e) {
    $("#rightDiv").load(this.href);
    return false; // I was sure preventDefault would work
  });
});

HTML

<div id="leftdiv" style="position:absolute;padding-right:5%; overflow:scroll;">
<a href="page1.htm">Launch page 1</a><br />
<a href="page2.htm">Launch page 2</a>
</div>

<div id="rightDiv" style="padding-left:30%"></div>

Answer 1

e.preventDefault();

没起作用？

• http://api.jquery.com/event.preventDefault/

$(‘a’).on(“单击”，函数(E){//做某事e.preventDefault()；})；

通常，将e.preventDefault();放在代码的顶部或末尾并不重要。我想也有e.stop()方法。但是当return false;对你有用的时候，你为什么不坚持它呢？

来自jQuery移动文档：

取消元素默认单击行为 应用程序可以在vclick事件上调用preventDefault()来取消元素的默认单击行为。在基于鼠标的设备上，在vclick事件上调用preventDefault()等同于在气泡事件阶段对实际单击事件调用preventDefault()。在基于触摸的设备上，由于实际的单击事件是在发送vclick事件后大约300 is发出的，所以它要复杂一些。对于触摸设备，在vclick事件上调用preventDefault()会触发vmouse插件中的一些代码，这些代码试图捕获浏览器在捕获事件阶段发出的下一个单击事件，并在其上调用preventDefault()和stopPropagation()。如上述警告所述，有时很难将触摸事件与相应的鼠标事件匹配，因为目标可能不同。由于这个原因，vmouse插件还会返回到尝试通过坐标标识相应的单击事件。在某些情况下，目标标识和坐标标识都失败，这会导致发出单击事件，或者触发元素的默认操作，或者在内容已被移动或替换的情况下，触发对另一个元素的单击。如果对给定的元素/控件定期发生这种情况，我们建议您使用单击来触发操作。

function() {
  return false;
}

// IS EQUAL TO

function(e) {
  e.preventDefault();
  e.stopPropagation();
}

资料来源： http://css-tricks.com/return-false-and-prevent-default/

似乎也支持.on()，因为document.ready不受支持。

资料来源： http://jquerymobile.com/test/docs/api/events.html

Answer 2

这可能会提供一个解决方案，但我缺乏解释原因的信息。最近我遇到了一个问题，preventDefault没有在类似的代码中工作，问题在于从$(document) vs $('body')委托以下内容：

<a href="http://stackoverflow.com" id="test1">Test 1</a>
<a href="http://stackoverflow.com" id="test2">Test 2</a>
<script>
    $('body').on('click', '#test1', function(e) {
        e.preventDefault();
        alert('hi 1');
    });

    $(document).on('click', '#test2', function(e) {
        e.preventDefault();
        alert('hi 2');
    });
</script>

然而，在jQuery 3.2.1中没有发生这种情况，我只能确认这是2.1.7的问题。