防止用戶通過點擊提交表單

如何通過點擊「Enter」鍵來阻止用戶提交聯繫表單？該表單通過使用FormMaster模塊完成。爲輸入域代碼如下：防止用戶通過點擊提交表單

<div id="dnn_ctr1410_FormMaster_ctl_9d6e1fc4341b453f905425dacbefddf2div"> 
    <label class="SubHead" id="dnn_ctr1410_FormMaster_lbl_ctl_9d6e1fc4341b453f905425dacbefddf2" for="dnn_ctr1410_FormMaster_ctl_9d6e1fc4341b453f905425dacbefddf2">Message*<br></label> 
    <textarea class="wsi_contactform_bottomcell" tabindex="1" id="dnn_ctr1410_FormMaster_ctl_9d6e1fc4341b453f905425dacbefddf2" wrap="off" cols="20" rows="2" name="dnn$ctr1410$FormMaster$ctl_9d6e1fc4341b453f905425dacbefddf2"></textarea> 
    <span style="display:none;" class="NormalRed" id="dnn_ctr1410_FormMaster_rfv_313f9f05e5224c4e9bbf2bf6808f43c9"><br>Enter your message.</span> 
</div>

我用下面的腳本，但沒有任何結果：

$('.wsi_contactform_bottomcell').on('keypress keydown keyup', function (e) { 
    if (e.keyCode == 13) { 
     e.preventDefault(); 
    } 
});

而且通過進入我指的是鍵盤上的「Enter」鍵！

來源

2013-10-18 BlueBay

只留下'keydown' – Spokey

在事件回調中放置一個斷點。如果未觸發，則將回調綁定到錯誤的元素。如果觸發，請查看「e」變量並查看其內容。無論如何keyCode應該是正確的。 – marquez

使用e.which

一些瀏覽器使用keyCode和其他人使用which。但與jQuery這是正常化，所以你不必考慮這一點。你可以選擇你喜歡的那個。

if (e.which == 13) { 
     e.preventDefault(); 
    }

參考event.which

看到demo

來源

2013-10-18 13:32:43

我剛剛試過這個，但也沒有正確的結果：/ – BlueBay

你有包括jquery和你的代碼文件準備好 –

謝謝你的例子。我已經準備好了代碼+文檔，但它不起作用。 – BlueBay

爲什麼不乾脆忽略按鍵和刪除一個提交按鈕。而不是添加一個this.submit（）按鈕。像這樣：

<input type="button" value="Submit contactform" onclick="this.submit();">

這將從窗體中刪除「回車鍵」功能。

來源

2013-10-18 13:34:58

這實際上是不可能的，因爲這行代碼是由模塊動態製作的。 – BlueBay

我已經完成了這個過去，它對我來說很好。這將禁用任何影響的整個頁面Enter鍵：

<input type="text" name="foo" onKeyPress="return disableEnterKey(event)" >

：

<script language="JavaScript"> 

function disableEnterKey(e) 
{ 
    var key;  
    if(window.event) 
      key = window.event.keyCode; 
    else 
      key = e.which; 

    return (key != 13); 
} 
</script> 

<body onKeyPress="return disableEnterKey(event)">

如果您想禁用表單提交針對特定的輸入字段中，從輸入字段的onkeypress事件處理函數調用此

編輯

對你來說：

$('.wsi_contactform_bottomcell').on('keypress', disableEnterKey);

如果腳本從未被調用，那麼您可能會試圖過早綁定處理程序。如果模塊沒有添加textarea，但jQuery將在選擇器返回零結果時以靜默方式失敗。如果是這種情況，那麼在嘗試綁定事件處理程序之前，您需要制定一個策略來確定模塊何時完成其對DOM的更新。

來源

2013-10-18 13:54:30

沒有「輸入類型」可用，請參閱模塊如何構建代碼 – BlueBay

對不起，這只是一個示例。根據您的具體情況更新。 –

試試這個，如果元素是動態創建的，你的代碼不會工作，因爲元素不存在。

$(document).on("keydown", ".wsi_contactform_bottomcell", function(e) {  
    if (e.keyCode == 13 || e.which == 13) { 
    e.preventDefault(); 
    } 
});

來源

2013-10-18 14:00:54 marquez

也不起作用，表格完全忽略腳本 – BlueBay

防止用戶通過點擊提交表單

回答

相關問題