html 在鼠标离开输入框 <input type='TEXT' name='page' id='page'>后执行一个方法
时间: 2024-01-13 09:02:37 浏览: 23
可以使用onblur事件,在输入框失去焦点时执行相应的方法。例如:
```html
<input type='text' name='page' id='page' onblur='myFunction()'>
```
这里的myFunction()是你想要执行的方法。当鼠标离开输入框时,该方法会被调用。
相关问题
html 在输入框 <input type='TEXT' name='page' id='page'>输入完后,点击页面其他地方时执行一个在后台输出1的功能
您可以使用JavaScript来实现这个功能。您可以在页面上添加一个点击事件监听器,以便在用户单击页面其他地方时触发事件。在事件处理程序中,您可以向后台发送一个请求,以便在后台输出1。以下是一个示例代码:
```html
<input type='TEXT' name='page' id='page'>
<script>
document.addEventListener('click', function(event) {
if (event.target.id !== 'page') {
// 发送请求到后台
fetch('/backend', {
method: 'POST',
body: JSON.stringify({output: 1})
});
}
});
</script>
```
在上面的代码中,我们添加了一个点击事件监听器到整个文档上。当用户单击页面上的任何元素时,事件处理程序将检查单击的元素是否是输入框。如果不是,它将向后台发送一个POST请求,并将输出设置为1。您需要将`/backend`替换为您的后端API的地址。
<%@ page contentType="text/html;charset=utf-8" %> <HTML><BODY bgcolor=yellow><FONT size=3> <FORM action=" " method=post name=form> 输入一组字符或数字: <INPUT type="text" name=" "> <INPUT TYPE="submit" value="Enter" name="submit"> </FORM> </FONT> </BODY> </HTML>修改
这段代码有两个问题,一个是 "action" 属性为空,无法确定表单数据将被发送到哪个处理程序;另一个是输入框的 "name" 属性值为空,无法确定输入的内容将在处理程序中如何被引用。我可以帮你修改一下:
```html
<%@ page contentType="text/html;charset=utf-8" %>
<HTML>
<BODY bgcolor=yellow>
<FONT size=3>
<FORM action="process.jsp" method="post" name="form">
输入一组字符或数字:
<INPUT type="text" name="input">
<INPUT type="submit" value="Enter" name="submit">
</FORM>
</FONT>
</BODY>
</HTML>
```
我在 "action" 属性中指定了表单数据将被发送到 "process.jsp" 处理程序,同时将输入框的 "name" 属性值改为 "input",这样在处理程序中可以通过 "request.getParameter("input")" 来获取输入的内容。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>添加合同信息</title> </head> <body bgcolor = "lightgreen"> <form action="http://localhost:8080/EIMS/contactManage/addContactCheck.jsp" method = "post"> 合同查询 合同添加
添加合同信息 客户姓名 <input type = "text" name = "clientName"/> 合同名称 <input type = "text" name = "contactName"/> 合同内容 <input type = "text" name = "contactContents"/> 合同有效日期 <input type = "text" name = "contactStart"/> 合同有效期 <input type = "text" name = "contactEnd"/> 业务员姓名 <input type = "text" name = "StaffName"/> <input type = "submit" name = "sure" value = "确认"/> <input type = "reset" name = "clear" value = "取消"/> </form> </body> </html>
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>登录界面</title> </head> <body> 登       录
<form action="login.action" method="post"> <label>账号:</label> <input class="f_text" type="text" name="account" placeholder="请输入账号" size="25">
<label>密码:</label> <input class="f_text" type="password" name="password" placeholder="请输入密码" size="25">
<input class="f_button" type="submit" value="登录"> <input class="f_button" type="reset" value="重置"> </form> 若无账号,请先注册! </body> </html>加注释
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)