return false的使用

使用”return false“，它只会在你的回调函数执行结束才去取消浏览器的默认行为，但是使用e.preventDefault，我们有更多的选择，它可以随时停止浏览器执行默认动作，而不管你将它放在函数的哪个部分。

只有当你同时需要preventDefault和stopPropagation，并且你的代码可以接受直到你的回调执行完成才停止执行浏览器的默认行为，那你就可以使用”return false“。

让浏览器停止继续执行默认行为

选择使用return false还是preventDefault，stopPropagation或者stopImmediatePropagation

当你每次调用”return false“的时候，它实际上做了3件事情：

•event.preventDefault();
•event.stopPropagation();事件冒泡就被终止了，click事件不会被冒泡
•停止回调函数执行并立即返回。

这3件事中用来阻止浏览器继续执行默认行为的只有preventDefault，除非你想要停止事件冒泡，否则使用return false会为你的代码埋下很大的隐患

preventDefault()

大多数情况下，当你使用return false时，你其实真正需要的是e.preventDefault()。要使用e.preventDefault，你需要确保你传递了event参数到你的回掉函数中（在这个例子里，就是那个e）：


$("a").click(function (e) { 
  // e == our event data 
  e.preventDefault(); 
});

它会替我们完成所有工作，但不会阻止父节点继续处理事件，要记住，你放在代码中的限制越少，你的代码就越灵活，也就越易于维护。

stopPropagation()

但有些情况下，你有可能需要停止事件冒泡

由于事件冒泡机制，除非在事件处理过程中被主动阻止冒泡（e.stopPropagation()），否则会将事件传递到document元素上。因此，在document元素上捕获click事件，并判断触发事件的元素有没有你想要的CSS类，就可以做到，动态增加的DOM元素的相应事件也能够被正确的处理。

你点了div上除了a链接之外的地方，我们希望能发生点什么事情（比如改变下背景什么的），但是不能影响用户点击a链接的行为


$("div.post").click(function () { 
  // Do the first thing; 
}); 
 
$("div.post a").click(function (e) { 
  // Don't cancel the browser's default action 
  // and don't bubble this event! 
  e.stopPropagation(); 
});

stopImmediatePropagation()

这个方法会停止一个事件继续执行，不同的widgets和plugin就有可能在同一个对象上添加事件，如果遇到这种情况，那你就很有必要理解和使用stopImmediatePropagation。

return false下面的confirm不会执行

$("#btnupload").click(function (e) {        	
$.post("security/installitcheck/queryByParentId", paras, function (data) {
        		debugger;
    			if (data.code != "0") {
    				$Core.UI.message.error("未录入设备，不可提交！");
    				return false;
    			}
    	    	$.messager.confirm('提示', '您确定提交吗?', function (r) {
    	    		
    	            if (r) {
    	            	var ids = "";
    	    			$.each(rows, function (k, j) {
    	    				ids += (ids == "" ? j[$id] : "," + j[$id]);
    	    			});
    	    			var paras = { ids: ids };
    	    			$.post(url, paras, function (data) {
    	    				if (data.code == "0") {
    	    					$Core.UI.message.success("提交成功!");
    	    					$dg.datagrid("load");
    	    				} else {
    	    					$Core.UI.message.error("服务器正忙！");
    	    				}
    	    			});
    	            }
    	        });
    		});
  });

return false;下面的confirm会执行

    $("#btnupload").click(function (e) {       	
$.post("security/installitcheck/queryByParentId", paras, function (data) {
        		debugger;
    			if (data.code != "0") {
    				$Core.UI.message.error("未录入设备，不可提交！");
    				return false;
    			}
    	    	
    		});
        	
        	$.messager.confirm('提示', '您确定提交吗?', function (r) {
	    		
	            if (r) {
	            	var ids = "";
	    			$.each(rows, function (k, j) {
	    				ids += (ids == "" ? j[$id] : "," + j[$id]);
	    			});
	    			var paras = { ids: ids };
	    			$.post(url, paras, function (data) {
	    				if (data.code == "0") {
	    					$Core.UI.message.success("提交成功!");
	    					$dg.datagrid("load");
	    				} else {
	    					$Core.UI.message.error("服务器正忙！");
	    				}
	    			});
	            }
	        });
 });

return false的使用

猜你喜欢