`

如何实现点击回车自动提交(当按钮为图片的时候)

阅读更多

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <base href="<%=basePath%>">

   <script type="text/javascript" src="<c:url value="/resources/js/jquery.js"/>"></script>

   <link type="text/css" rel="stylesheet" href='<c:url value="/resources/css/login.css"></c:url>' />

    <title>登录</title>

   <script type="text/javascript">

 function check(){ 

  

   if(document.getElementById("t1").value==0)

   {   

   alert("用户名不能为空!");

   return;

   }

   else if(document.getElementById("t2").value==0){

     alert("密码不能为空!"); 

     return;

   }else {

     document.forms[0].submit();

   }

 $(function(){         

    $('#kaptchaImage').click(function () {//生成验证码  

     $(this).hide().attr('src', 'common/user/handle?' + Math.floor(Math.random()*100) ).fadeIn();  

     event.cancelBubble=true;  

    });  

});   

  

window.onbeforeunload = function(){  

    //关闭窗口时自动退出  

    if(event.clientX>360&&event.clientY<0||event.altKey){     

        alert(parent.document.location);  

    }  

};  

  

function changeCode() {  

    $('#kaptchaImage').hide().attr('src', 'common/user/handle?' + Math.floor(Math.random()*100) ).fadeIn();  

    event.cancelBubble=true;  

}  

function clickBtn(event) {

if (event.keyCode==13) {

        check();

    }

}

</script>  

</head>  

<body onkeypress="clickBtn(event)">

 

<form action="<c:url value="/common/user/loginCheck"/>" method="post">

<div class="text"></div>

<div class="uName"><input type="text"  id="t1" name="loginName"/></div>

<div class="pwd"><input type="password"  id ="t2" name="password"/></div>

<div class="code1">  <input name="chknumber" type="text" id="kaptcha" maxlength="4" class="chknumber_input" />      </div>

<div class="code2"><a href="javascript:changeCode()">看不清,换图</a> 

</div>

<div class="butLogin" ><img src="<c:url value="/resources/images/but_login.png/" />" width=57px; height=29px; onclick="check();"/>

</div>

</form>

 

</body>

</html>

 

分享到:
评论

相关推荐

    ie ,火狐 文本框回车自动提交

    在网页开发过程中,一个常见的需求是当用户在文本框中按下回车键时,自动...总之,通过合理利用HTML、CSS和JavaScript,我们可以有效地解决在不同浏览器中实现文本框回车自动提交的问题,为用户提供无缝的交互体验。

    点击回车提交表单,应用Java技术实现。

    通常情况下,表单提交通过点击提交按钮触发,但在某些场景下,为了提高用户体验,开发者会选择使用键盘事件(如按Enter键)来触发表单提交。 #### 二、使用Java技术实现表单提交 虽然题目中提到“应用Java技术实现...

    C#实现回车光标自动跳到下一个控件的几种方法

    当用户在文本框(TextBox)中按下回车键时,通常希望光标能够自动移动到下一个控件,以便连续输入或执行某些操作。本篇文章将深入探讨如何在C#中实现这种功能,主要涉及以下知识点: 1. **事件处理**:在C#中,事件...

    jsp中如何实现按下回车键自动提交表单

    要实现回车键自动提交表单,我们可以添加一个JavaScript函数,该函数监听键盘事件,并在检测到回车键被按下时模拟点击提交按钮。这里的关键在于捕获键盘事件(`keydown`或`keyup`)并检查其按键码(keyCode)。回车...

    按回车键提交表单~~~~~

    如果确实按下了回车键,则模拟点击提交按钮的行为,进而实现表单的自动提交。 ### 2. 兼容性问题及解决方案 在上述代码中,可以看到开发者为了兼容IE浏览器而特别编写了一段逻辑。这是因为早期的IE浏览器与其他...

    Textbox控件注册回车事件及触发按钮提交事件具体实现

    引子: 在ASP.Net页面中textbox的index为1(或n),其后的提交按钮index为2(n+1),光标在textbox中,回车后自动焦点移动到后面的button上,会触发button的点击事件。 但在Lyncplus客户端中访问Web页面时遇到了TextBox...

    如何防止INPUT按回车自动提交表单FORM

    这在某些场景下可能不符合开发者的设计需求,比如需要用户手动点击提交按钮或者执行特定的验证逻辑。本文将详细介绍如何防止`&lt;input&gt;`按回车键自动提交`&lt;form&gt;`表单。 首先,我们来看一下问题的示例代码: ```html ...

    按回车表单自动提交问题意外发现

    表单提交是Web应用中非常常见的操作,通常是通过点击一个提交按钮来实现。然而,在实际开发中,有时候会遇到一些特殊的需求或者行为,比如在没有提交按钮的情况下,用户按下回车键(Enter键)时,表单也能够进行提交...

    禁止按回车键提交表单的方法

    然而,如果表单包含两个或多个文本输入框,浏览器就不会在任何输入框中按下回车时自动提交表单。这是浏览器的一个默认行为。 针对这一行为,我们可以采取以下策略来禁止回车键提交表单: 1. 添加一个隐藏的文本...

    javascript 回车键触发表单提交的问题

    通常,表单提交可以通过点击提交按钮或者按下回车键(Enter)来实现。然而,在一些场景中,我们可能需要控制回车键的行为,以便使其在特定情况下触发表单提交,在其他情况下则不执行此操作。以下是关于JavaScript...

    js 回车提交表单两种实现方法

    当用户在表单输入区域按下回车键(keyCode为13)时,自动提交表单是一种常见且方便的用户体验。本文将探讨如何使用JavaScript和jQuery来实现当用户在表单中按下回车键时触发表单提交的两种方法。 首先,我们要了解...

    Form表单按回车自动提交表单的实现方法

    在前端开发中,表单交互是用户界面的重要组成部分,而其中的一个常见需求是让用户通过按回车键自动提交表单。本文将详细讲解如何实现这一功能,并探讨在不同情况下是否需要自动提交表单。 首先,当一个`&lt;form&gt;`表单...

    js与jquery回车提交的方法.docx

    - 当实现表单自动提交功能时,需要确保用户的输入数据已经被正确验证,以防止恶意输入。 - 使用HTTPS协议传输敏感数据,避免用户信息泄露。 综上所述,无论是使用原生JavaScript还是jQuery,都能够有效地实现回车...

    jQuery实现当按下回车键时绑定点击事件

    在这个场景中,我们想要实现的是当用户按下回车键时,模拟点击一个按钮,触发与之绑定的事件。下面将详细解释如何使用jQuery来实现这个功能。 首先,我们要关注的关键代码片段如下: ```javascript $(function(){ ...

    js 监听页面回车事件 过滤文本域

    主要是为了页面没有提交按钮 无法实现回车自动提交所写在功能,屏蔽了表单中文本域回车导致提交功能。

    网页中表单按回车就自动提交的问题的解决方案

    这是因为浏览器遵循HTML规范,当表单中没有明确的提交按钮(`&lt;input type="submit" /&gt;`或`&lt;button&gt;`)时,仅有的文本输入框被视为提交的触发器。 为了解决这个问题,有以下两种常见的方法: 1. 添加一个隐藏的...

    JSP中的FORM表单中只有一个input文本时,按回车键将会自动提交表单

    这是因为浏览器的默认行为:在一个只有一个单行文本输入域(type="text")的表单里,按下回车键会模拟点击表单的提交按钮。这种行为在某些情况下可能会导致意外的表单提交,例如在搜索界面中,用户可能期望回车键...

Global site tag (gtag.js) - Google Analytics