JSFiddle中html表單onsubmit事件的行為

Question

我有一個簡單的表單，除了提交按鈕外沒有其他任何東西。 我要做的就是防止提交表單（我知道這沒有任何意義，但這僅是為了說明）。 因此，我正在使用表單的onsubmit事件，並且此事件returns false 。 這確實有效，但這是“難以理解的行為”出現的地方。

我可以將return false;關聯起來return false; 通過使用內聯JavaScript或將其放在其他位置來聲明帶有表單的onsubmit事件的語句。

<form onsubmit="return false;" id="form1" method="post">
    <input type="submit" id="btnButton" value="Submit" />
</form>

現在，上述代碼可以正常工作。 參見=> http://jsfiddle.net/MccK5/

我什至可以如下修改上面的代碼，以使JavaScript分離（不干擾）。

--some html markup initially
<form onsubmit="return falsifier()" id="form1" method="post">
    <input type="submit" id="btnButton" value="Submit" />
</form>

<script>
    function falsifier() {
    return false;
}
</script>


--other html markup follows

在這里，腳本標記在HTML標記中緊隨表格放置。 這也可以。 參見=> http://jsfiddle.net/AfdQ5/

但是，當我將JavaScript移到其他位置（例如：外部文件）時，這似乎不起作用。

通過查看inspect元素中的控制台，我注意到falsifier is not defined錯誤falsifier is not defined 。

在這里查看此=> http://jsfiddle.net/5cR5R/2/

有人可以詳細說明為什么會這樣嗎？

Answer 1

您在JSFiddle中遇到設計功能（或缺陷）：

在JSFiddle中，“ JavaScript”窗格不是所引用JavaScript文件的直接源代碼，而是JSFiddle如下包裝該代碼並將其插入<head> 。 只需轉到“查看源代碼”以查看其功能：

<script type='text/javascript'>
    //<![CDATA[ 
    window.onload=function(){
        function falsifier() {
            return false;
        }
    }
    //]]>  
</script>

您的<form>元素找不到falsifier因為falsifier僅存在於此匿名函數的范圍內。

JSFiddle中html表單onsubmit事件的行為

問題描述

1 個解決方案

解決方案1
2 已采納 2014-05-29 19:48:00

JSFiddle中html表單onsubmit事件的行為

問題描述

1 個解決方案

解決方案1 2 已采納 2014-05-29 19:48:00

解決方案1
2 已采納 2014-05-29 19:48:00