[英]Pressing enter key submit the form?
HTML代碼:
<html>
<head>
<title>Registration Form</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="css/style.css">
<script>
function submitAlbum(){
var str1 = removeSpaces(document.getElementById('txtCaptcha').value);
var str2 = removeSpaces(document.getElementById('txtInput').value);
alert("condition1 is ..."+str1);
alert("condition2 is ..."+str2);
alert("condition3 is ..."+str1 == str2);
if (str1 == str2)
{
//alert("Entered captcha is correct");
}
else{
alert("Entered captcha is wrong");
document.getElementById("txtInput").value="";
return false;
}
var frm=document.getElementById("custRegistration");
frm.action="CustomerinfoServlet?formidentity=doRegistrations";
frm.submit();
}
</script>
</head>
<body style=" background-color:#f9f9f9" onload="DrawCaptcha();">
<div style="width: 100%; background-repeat:no-repeat; margin-top:30px; height:546px; background-image: url('images/mac.png')">
<br/><br/>
<div style="margin: 0 auto; background-color: #ffffff; opacity:0.9; border: 1px solid #D7EBFF; width: 400px; padding: 15px; height: 440px; margin-left: 56%;">
<form class="form" name ="custRegistration" id="custRegistration" onsubmit="return submitAlbum(this)" action="download.jsp" method="post" >
<p class="name">
<label for="name">Name <span style="color:red">*</span>:</label>
<input type="text" name="name" id="name" placeholder="" pattern="[A-Za-z ]{3,20}" required/>
<input type="hidden" id="formidentity" name="formidentity" value="doRegistrations"/>
</p>
<p class="email">
<label for="email">Email Id <span style="color:red">*</span>:</label>
<input type="email" name="email" id="email" pattern="((\w+\.)*\w+)@(\w+\.)+(com|org|net|us|info|biz|co)" required aria-required="true" placeholder="" required/>
</p>
<p class="Captcha" style="margin-top:5%; width: 100%;">
<div style="margin:0 0 0 1%">
<label class="captchalabel" style="width:38%; float: left;"><span style="margin:0 0 0 9%">Enter the text </span> <span style="color:red">*</span>:</label>
<input type="text" name="txtInput" id="txtInput" style="float: left;" required/> </div>
<div style="width: 20%; float: right;">
<input type="text" id="txtCaptcha" style="background-color:#E7EBF5; text-align:center; margin: 19px 104px 0px 0px; width: 120px; border-radius:0px; border:1px solid #ccc; font-weight:bold; font-family:Arial; " />
<input type="image" id="btnrefresh" onclick="DrawCaptcha();" src="images/captcha.png"/>
</div>
</p>
<p class="submit">
<input type="submit" value="Submit" />
</p>
</form>
</div>
</div>
</body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.realperson.js"></script>
<script type="text/javascript">
//Created / Generates the captcha function
function DrawCaptcha()
{
var a = Math.floor(Math.random() * 10)+ '';
var b = Math.floor(Math.random() * 10)+ '';
var c = Math.floor(Math.random() * 10)+ '';
var d = Math.floor(Math.random() * 10)+ '';
var e = Math.floor(Math.random() * 10)+ '';
var f = Math.floor(Math.random() * 10)+ '';
var g = Math.floor(Math.random() * 10)+ '';
var code = a + ' ' + b + ' '+ c + ' ' + d + ' ' + e + ' '+ f + ' ' + g;
document.getElementById("txtCaptcha").value = code
}
// Remove the spaces from the entered and generated code
function removeSpaces(string)
{
return string.split(' ').join('');
}
</script>
</html>
在這我有一個問題。 問題是每當我在驗證碼文本框中輸入任何文本並按Enter鍵時。 然后驗證碼代碼正在改變,即數字正在刷新。 表格也是提交和獲取消息('驗證碼錯誤')。 當我們在文本框中輸入驗證碼后按Enter鍵時,有人能告訴我如何停止表單提交嗎?
那么你可以使用jQuery禁用驗證碼輸入字段上的Enter
按鈕。
一個例子是:
$('#txtInput').bind("keypress", function (e) {
if (e.keyCode == 13) return false;
});
其中keyCode == 13
是Enter
鍵
更新要在文件中添加上述代碼,只需將其復制並粘貼到您的html中:
<script type="text/javascript">
$(document).ready(function(){
$('#txtInput').bind("keypress", function (e) {
if (e.keyCode == 13) return false;
});
});
</script>
您可以使用以下jQuery代碼執行此操作:
$('#custRegistration').bind("keyup keypress", function(e) {
var code = e.keyCode || e.which;
if (code == 13) {
e.preventDefault();
return false;
}
});
LOL :) AS dfsq在評論中說:“如果你不想提交表格,為什么還要按Enter?”
但要阻止使用輸入輸入發送表單,請執行以下操作:
$('body').on('keydown', '#chaptcha_input', function(e) {
if(e.which == 13 && !e.shiftKey) {
e.preventDefault();
}
});
嘗試這個
$('#txtInput').on("keyup",function(e){
if(e.keyCode == 13)
return false;
// do your stuff here if not enter key pressed
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.