Django表單提交按鈕的onclick不會調用JavaScript函數

Question

我有一個Django表單，需要在提交表單之前進行一些客戶端驗證。 這是模板中的代碼：

<form action="/{{ blog_entry.id }}/addComment/" method="post">
{{ commentForm.name.label_tag }} 
{{ commentForm.name }}
<span id="spanNameReq" style="color:Red; display:none;">Required</span>
<br />     
{{ commentForm.email.label_tag }} 
{{ commentForm.email }}
<span id="spanEmailReq" style="color:Red; display:none;">Required</span>
<span id="spanEmailInvalid" style="color:Red; display:none;">Invalid e-mail address</span>
<br />
{{ commentForm.website.label_tag }} 
{{ commentForm.website }}
<span id="spanWebsiteInvalid" style="color:Red; display:none;">Invalid URL</span>
<br />    
{{ commentForm.comment.label_tag }} 
<span id="spanCommentReq" style="color:Red; display:none;">Required</span>   
<br />
{{ commentForm.comment }}
<br />  
<input type="submit" value="Add comment" onclick="javascript:var ret = validateComment(); return ret;" />  
</form>

但是問題在於，validateComment根本不會被調用，並且表單會立即提交。 奇怪的是，如果我將onclick事件替換為

javascript:alert('test');

要么

javascript:return false;

JS代碼可以很好地執行（在第二種情況下，它不會提交表單）。

為什么它不執行我指定的功能？ 只是為了確認我已經將腳本文件包含在HTML頭中（包括嵌入模板中的JS代碼沒有區別），並且如果我不使用Django表單，但是使用正常的HTML表單就可以了。

Answer 1

我不認為您的函數正在被調用。 我的直覺是您拼錯了一些內容。 嘗試將alert（）放入函數中。

Answer 2

首先，請刪除該“ javascript”偽協議前綴。 它在onclick屬性中絕對沒有位置。 它是為在hrefs中使用而發明的，但已被on *方法取代-整個要點是，您應該只使用javascript本身。

其次，為什么要麻煩變量呢？ 為什么不只return validateComment()呢？

第三，您如何確定該函數“根本沒有被調用”？ 該函數似乎正在被調用，只是沒有返回您認為的樣子。 請發布該函數的代碼，也許有人會發現問題所在。

Answer 3

直接在HTML中編寫Javascript事件可能會在以后給您帶來問題-而是嘗試給表單一個ID，並在<head>部分中捕獲Javascript的Submit事件

例如使用jQuery，並且表單具有id =“ my_form”：

<script type="text/javascript">

$(document).ready(function(){

$('#my_form').submit(function(){

    if ([test here]){
        return true; 
    } else {
        return false; //prevents submission
    } 

})

})

</script>

Django表單提交按鈕的onclick不會調用JavaScript函數

問題描述

3 個解決方案

解決方案1
1 已采納 2009-11-08 00:31:25

解決方案2
0 2009-11-07 23:40:43

解決方案3
0 2009-11-08 00:05:09

Django表單提交按鈕的onclick不會調用JavaScript函數

問題描述

3 個解決方案

解決方案1 1 已采納 2009-11-08 00:31:25

解決方案2 0 2009-11-07 23:40:43

解決方案3 0 2009-11-08 00:05:09

解決方案1
1 已采納 2009-11-08 00:31:25

解決方案2
0 2009-11-07 23:40:43

解決方案3
0 2009-11-08 00:05:09