event.stopPropagation()、event.preventDefault()、return false 冒泡事件 默認事件

參考文章：https://blog.csdn.net/qq_39207948/article/details/79408323

1.event.stopPropagation()方法

這是阻止事件的冒泡方法，不讓事件向document上蔓延，但是默認事件依然會執行，當你調用這個方法的時候，如果點擊一個連接，這個連接仍然會被打開；

2.event.preventDefault()方法

這是阻止默認事件的方法，調用此方法是，鏈接不會被打開，但是會發生冒泡，冒泡會傳遞到上一層的父元素；

3.return false  ；

這個方法比較暴力，他會同時阻止事件冒泡也會阻止默認事件；寫上此代碼，連接不會被打開，事件也不會傳遞到上一層的父元素；可以理解爲return false就等於同時調用了event.stopPropagation()和event.preventDefault()

以上是原文中的內容；

---------------------------------------分割線----------------------------------------

參考文章中的代碼是基於jquery的，其實在原生js中return false是不會阻止事件冒泡的，只會阻止默認事件，是jquery對return false做的處理，導致有阻止事件冒泡的功能。

三種綁定事件的方式：

<form action="http://www.test.com/Dailoge/" οnsubmit="return check()">
    <input type="submit" value="提交" />
</form>
  
<script type="text/javascript">
    function check(){
        if(!confirm('確定？')){
            return false; //很關鍵的地方在onsubmit中要寫return，纔有效
        }
    }
</script>

<form action="http://www.test.com/Dailoge/">
    <input type="submit" value="提交" />
</form>
<script type="text/javascript">
    myform = document.getElementsByTagName('form')[0]
    myform.onsubmit = function () {
        if (!confirm('你確定？')) {
            return false;
        }
    }
</script>

myform = document.getElementsByTagName('form')[0];
if (myform.addEventListener) {
    myform.addEventListener('submit', check, false);
} else {//for ie 
    myform.attachEvent("onsubmit", check);
}

function check(ev) {
    if (!confirm('確定？')) {//驗證出錯的情況just a demo 
        ev = ev || window.event; // Event對象 
        if (ev.preventDefault) { // 標準瀏覽器 
            ev.preventDefault();
        } else { // IE瀏覽器 
            window.event.returnValue = false;
        }
        /*return false; 無效
        我們測試的時候我們會發現IE下能夠阻止表單提交，但是FF、chrome等瀏覽器並不能阻止表單提交
        原因是：Object EventListener：This is an ECMAScript function reference. This method has no return value. The parameter is a Event object.
        可見，listener是沒有返回值的（寫了也不會認），因此我們的check函數的返回值是不起作用的。*/
    }
}