“开"防止默认 [英] "on" preventDefault

问题描述

我在这里缺少什么?

请注意:使用jQuery MOBILE

• 使用 preventDefault 的演示

• DEMO 使用 return false

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

$(document).ready(function() {$("#leftdiv a").on("点击",function(e) {$("#rightDiv").load(this.href);返回假；//我确信 preventDefault 会起作用});});

HTML

<div id="leftdiv" style="position:absolute;padding-right:5%;overflow:scroll;"><a href="page1.htm">启动页面 1</a><br/><a href="page2.htm">启动第 2 页</a></div><div id="rightDiv" style="padding-left:30%"></div>

解决方案

e.preventDefault();

没用?

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

<块引用>

$('a').on("click",function(e){//做一点事e.preventDefault();});

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

来自 jQuery 移动文档:

<块引用>

取消元素默认点击行为

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

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

What am I missing here?

Please note: jQuery MOBILE is used

• DEMO using preventDefault

• DEMO using return false

If I use preventDefault the page loads as if I had just links and no script, when I change to return false (which I always used to use on the plain JS onclick event handler), it works as expected. I have already looked through other posts and all use .click and all suggest 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>

解决方案

e.preventDefault();

didn't work ?

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

$('a').on("click",function(e){
     //do something
     e.preventDefault();
});

Putting e.preventDefault(); on the top or on the end of your code does not matter normally. There is also the method e.stop() I guess. But why don't you stick with return false; when it's working for you ?

From jQuery mobile documentation:

Canceling an elements default click behavior

Applications can call preventDefault() on a vclick event to cancel an element's default click behavior. On mouse based devices, calling preventDefault() on a vclick event equates to calling preventDefault() on the real click event during the bubble event phase. On touch based devices, it's a bit more complicated since the actual click event is dispatched about 300ms after the vclick event is dispatched. For touch devices, calling preventDefault() on a vclick event triggers some code in the vmouse plugin that attempts to catch the next click event that gets dispatched by the browser, during the capture event phase, and calls preventDefault() and stopPropagation() on it. As mentioned in the warning above, it is sometimes difficult to match up a touch event with its corresponding mouse event because the targets can differ. For this reason, the vmouse plugin also falls back to attempting to identify a corresponding click event by coordinates. There are still cases where both target and coordinate identification fail, which results in the click event being dispatched and either triggering the default action of the element, or in the case where content has been shifted or replaced, triggering a click on a different element. If this happens on a regular basis for a given element/control, we suggest you use click for triggering your action.

function() {
  return false;
}

// IS EQUAL TO

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

Source: http://css-tricks.com/return-false-and-prevent-default/

It also seems that .on() isn supported also as document.ready is not supported

Source: http://jquerymobile.com/test/docs/api/events.html

这篇关于“开"防止默认的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！