【问题标题】:Using the Enter key to Access Submit Button in HTML在 HTML 中使用 Enter 键访问提交按钮
【发布时间】:2013-06-11 07:15:42
【问题描述】:

我已经搜索并应用了几乎所有我能得到的代码,但似乎没有任何效果。

我正在尝试实现验证,我只想在密码字段上按 Enter 时,它会访问提交按钮以及调用的函数..

这是我的整个(相当长:D)代码

<!DOCTYPE html>
<html>
<head>
<title>Student Information</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script>
function reset()
{
   document.forms['testform'].reset();
   document.getElementById("x1").focus();
}
function passfocus()
{
document.getElementById("x2").focus();
} 
 function passreset()
 {
  document.getElementById("x2").value="";
  document.getElementById("x2").focus();
 }

 function Result()
 {
  var user=document.getElementById("x1").value;
  var pass1=document.getElementById("x2").value;
  passw=+pass1;
  var at=user.indexOf("@");
  var dot=user.lastIndexOf(".");
  var sub=user.substring(user.length, dot+1);
  for(i=0;i<sub.length;i++)
  {
    var d=sub.charAt(i);
    if(d==='0' || d===',' || d==='?' ||d===';' || d===':' || d==='+' || d==='=' || d==='-' || d==='1' ||d==='2' || d==='!' ||d==='@' ||d==='#' ||d==='$' ||d==='%' ||d==='^' ||d==='&' ||d==='*'|| d==='(' || d===')'|| d==='3' ||d==='4' ||d==='5' ||d==='6' ||d==='7' ||d==='8' ||d==='9')
    var d1=0;
    else
    var d1=1;
}
var count=0;
for(j=0;j<user.length;j++)
{
    var d2=user.charAt(j);
    if(d2=='@')
    count=count+1;              
}
var flag=0;
for(k=0; k<(user.length-1); k++)
{
    if(user.charAt(k)==='.' && user.charAt(k+1)==='.')
    flag=1;
}           
if(!user)
{
    alert("Field is mandatory");
}
else if(d1===0)
{
    alert("E-mail not valid"); 
    reset(); 
}
else if(count===2)
{
    alert("E-mail not valid");
    reset();
}
else if(at<1 || dot<at+2 || dot+2>=user.length)
{
    alert("E-mail not valid");
    reset();
}
else if (flag===1)
{
    alert("E-mail not valid");
    reset(); 
}
else
{
    if(passw===0)
    {
        alert("Please enter password");
        passfocus();
    }
    else if(pass1.length<8)
    {   
        alert("Password must be greater than 8 characters");
        passreset();
    }
    else
    {
        alert("you have successfully submitted the form");
        reset();
    }
}
}
</script>
</head>
<style>
p.serif{font-family:"Times New Roman",Times,serif;}
.sansserif{font-family:Arial,Helvetica,sans-serif;}
.td1{text-align:middle;}
table,td,th
{
border:1px solid red;
}
table
{
width:100%;
}
th
{
height:50px;
}
td
{
padding:15px;
}
</style>
<body style="background-color:AntiqueWhite;">
<h2 align="middle" style="background-color:White;"><font      color="MediumVioletRed">Student Login</font></h2>
<p align="middle" class="sansserif" style="background-color:yellow;"><b><i><font  color="Maroon">Enter Student Credentials below to login</font></i></b></p>
<table border="1" >
    <th>CREDENTIALS</th>
<tr>
      <td class="sansserif">
      <form name="testform" align="middle" 
        <div style="color:#006400" class="myCustomDiv">
        E- mail ID: <input type="text" name="usern" id="x1">
        <br>
        Password: <input type="password" name="pass" id="x2" >
        <br>
        <button type="button" onclick="Result()" align="middle" id="x3">Login</button>
        </div>
    </form>
    </td>
</tr>
</table>
</body>
</html>

只是为了详细说明,我没有缩短它。我知道这是非常基本的,如果有人可以提供帮助,我将非常感激。

【问题讨论】:

  • 使用正则表达式可以使代码缩短 1000%。
  • 我知道,我昨天才学 HTML :(
  • 为什么你的按钮有type="button"而不是type="submit"
  • 你能把这个放在 jsfiddle 里吗?
  • 你也有很多内联样式,如果你正在使用样式表(你就是),你应该把这些内联样式取出并放在样式表中。内联样式仅适用于 HTML 电子邮件...

标签: javascript html css enter submit-button


【解决方案1】:

您的 html 中有严重的错误。在&lt;/head&gt;&lt;body&gt; 之间有一个&lt;style&gt; 元素。像这样的事情是不可以的!

并且表单的定义不完整:您缺少开始标记上的&gt;,以及action 属性。后者是强制性的,是无法提交的原因。

除此之外,您还有其他错误,例如在 javascript 中。
例如,passw=+pass1 是什么意思?
但所有这些都是表单开始标记问题的次要问题。先修复这些,然后你就可以正常测试了,因为提交会工作。

【讨论】:

  • 是的!谢谢 !!错误很奇怪。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2016-04-23
  • 1970-01-01
  • 2012-02-17
  • 2021-08-28
  • 2021-10-28
  • 2012-01-24
  • 1970-01-01
相关资源
最近更新 更多