PreventDefault不阻止表單發送

我有一個非常簡單的頁面，我試圖阻止使用jQuery發送，但代碼出乎意料地無法工作。有任何想法嗎？PreventDefault不阻止表單發送

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script> 
     <script> 

      $("#searchForm").submit(function(e){ 
       e.preventDefault(); 
     }); 

    </script> 

</head> 
<body> 
    <form id="searchForm"> 
     <input name="q" placeholder="Go to a Website"> 
     <input type="submit" value="Search"> 
    </form> 
    <pre id="response"></pre> 
</body>

來源

2014-07-20 user3169790

您需要將代碼包裝在.ready()中，以便在DOM準備就緒時執行該代碼。

$(document).ready(function() { 
    $("#searchForm").submit(function(e){ 
     e.preventDefault(); 
    }); 
});

來源

2014-07-20 06:29:25 martynas

你的代碼是在頭，因此執行<form>甚至存在了。因此，選擇器#searchForm什麼都不匹配。將腳本標記放置在表單下方。

來源

2014-07-20 06:26:26

他們還可以讓自己的JavaScript無法執行，直到頁面已經通過'DOMContentLoaded'事件偵聽器加載完成後，不知道它是在jQuery中雖然。但是，頁面底部的JavaScript更好，因爲它不會阻止渲染。 – David

$(document).on('submit', function(e){ 
    e.preventDefault(); 
});

來源

2014-07-20 06:26:39 carter

您需要延遲添加事件偵聽器功能，直到瀏覽器加載完頁面。否則，這些JavaScript行將在表單元素存在之前執行，因此該函數不會附加到它。

裹事件偵聽器jQuery's .ready() method：

$(document).ready(function() { 
    $('#searchForm').submit(function(event) { 
    event.preventDefault(); 
    }); 
});

來源

2014-07-20 06:32:47 jtheletter

PreventDefault不阻止表單發送

回答

相關問題