<input type="text" id="pageInput "/>点击输入框获取输入框输入的值,请给出代码
时间: 2023-12-05 17:58:32 浏览: 43
以下是获取输入框输入值的代码:
```
var inputVal = document.getElementById("pageInput").value;
```
其中,document.getElementById() 是 JavaScript DOM API 中获取 HTML 元素的方法,传入输入框的 id 可以获取该输入框元素对象,而 .value 则表示获取该输入框当前的值。
相关问题
详细解读一下这段代码:<%@ page language="java" import="java.text.*,java.util.*" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>使用application内置对象--inputMessage.jsp</title> <style> #form2 input { color: green; font-weight: bold; } </style> </head> <body bgcolor="#abcdef"> <form action="checkMessage.jsp" method="post"> 请输入姓名: <input type="text" name="name" /><br> 请输入标题: <input type="text" name="title" /><br> 请输入内容: <textarea cols="40" rows="10" name="message"></textarea> <br> <br> <br> <input type="submit" value="留言" /> </form> <br> <form id="form2" action="showMessage.jsp" method="post"> <input type="submit" value="查看留言板" /> </form> </body> </html>
这是一个JSP页面,用于实现留言板功能。下面是对每部分的解释:
1. <%@ page ... %>:这是指令部分,用于定义该JSP页面的属性,例如语言,字符集等。
2. <html> ... </html>:这是HTML标签部分,用于定义网页的结构和内容。
3. <head> ... </head>:这是头部标签部分,用于定义网页的标题、字符集等信息。
4. <meta>:该标签用于设置网页的元数据,例如字符集、关键字等。
5. <title>:该标签用于设置网页的标题。
6. <style> ... </style>:该标签用于定义网页的样式,例如文本颜色、字体等。
7. <body> ... </body>:该标签用于定义网页的主体部分。
8. <form> ... </form>:该标签用于定义一个表单,用于用户输入和提交数据。
9. <input>:该标签用于定义表单中的输入框,例如文本框、单选框等。
10. <textarea>:该标签用于定义表单中的多行文本框。
11. <br>:该标签用于定义换行符。
12. <submit>:该标签用于定义表单中的提交按钮。
总体来说,该JSP页面包含两个表单,一个用于输入留言信息,另一个用于查看留言板。用户在输入留言信息的表单中,需要输入姓名、标题和内容,并点击“留言”按钮提交信息到checkMessage.jsp页面进行验证和保存。在查看留言板的表单中,用户可以点击“查看留言板”按钮跳转到showMessage.jsp页面查看留言信息。
解释下列代码:<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>学生信息查看</title> <link rel="stylesheet" href="layui/css/layui.css"> </head> <body> <div class="layui-card-body"> <div class="layui-form-item"> <label class="layui-form-label">学生ID:</label> <div class="layui-input-block"> <input type="text" class="layui-input" id="id" readonly style="border: none;"> </div> </div> <hr class="layui-bg-black"> <div class="layui-form-item"> <label class="layui-form-label">学生姓名:</label> <div class="layui-input-block"> <input type="text" class="layui-input" id="name" readonly style="border: none;"> </div> </div> <hr class="layui-bg-black"> <div class="layui-form-item"> <label class="layui-form-label">学生性别:</label> <div class="layui-input-block"> <input type="text" class="layui-input" id="sex" readonly style="border: none;"> </div> </div> <hr class="layui-bg-black"> <div class="layui-form-item"> <label class="layui-form-label">出生年月:</label> <div class="layui-input-block"> <input type="text" class="layui-input" id="birthday" readonly style="border: none;"> </div> </div> <hr class="layui-bg-black"> <div class="layui-form-item"> <label class="layui-form-label">学生手机:</label> <div class="layui-input-block"> <input type="text" class="layui-input" id="mobile" readonly style="border: none;"> </div> </div> <hr class="layui-bg-black"> <div class="layui-form-item"> <label class="layui-form-label">学生邮箱:</label> <div class="layui-input-block"> <input type="text" class="layui-input" id="email" readonly style="border: none;"> </div> </div> <hr class="layui-bg-black"> <div class="layui-form-item"> <label class="layui-form-label">学生班级:</label> <div class="layui-input-block"> <input type="text" class="layui-input" id="clazzName" readonly style="border: none;"> </div> </div> <hr class="layui-bg-black"> <div class="layui-form-item"> <label class="layui-form-label">学生导师:</label> <div class="layui-input-block"> <input type="text" class="layui-input" id="teacherName" readonly style="border: none;"> </div> </div> <hr class="layui-bg-black"> </div> </body> </html>
这是一个基于Java语言和Layui框架的Web页面,用于展示学生的信息。其中,`<%@ page contentType="text/html;charset=UTF-8" language="java" %>`指定了页面的编码和语言类型为UTF-8和Java,`<html>`标签表示页面的开始,`<head>`标签中包含了页面的标题和引入了Layui的CSS文件,`<body>`标签中包含了页面的主体内容。
页面的主体内容由一个名为`layui-card-body`的div容器包含,其中包含了多个名为`layui-form-item`的div容器。每个`layui-form-item`容器都包含了一个`label`标签和一个`input`标签,用于展示学生的不同信息。其中,`input`标签的`readonly`属性表示该输入框只读,`style`属性中的`border: none;`表示该输入框没有边框。
`<hr>`标签表示页面中的水平线,用于分隔不同的信息。
阅读全文
相关推荐













<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>登录界面</title> <style type="text/css"> .divForm{ position: absolute; width: 300px; height: 280px; top: 30%; left: 40%; margin-top: 1px; margin-left: 5px; } .title{ width:100%; height:50px; font-size:38px; line-height:50px; margin-bottom:20px; font-family: 华文宋体; color: cornflowerblue; } </style> </head> <body> <form method="post" action="${pageContext.request.contextPath}/login/judgeLogin"> 欢 迎 登 录 <label class="control-label"> 用户名: <input type="text" class="form-control" name="userName" id="userName" autocomplete="off" placeholder="请输入用户名"> </label> <label class="control-label"> 密码: <input type="password" class="form-control" name="userPwd" id="userPwd" autocomplete="off" placeholder="请输入密码"> </label> 注册账号 <button type="submit" class="btn btn-primary">登录</button> </form> <script> function jumpRegister() { window.location = "${pageContext.request.contextPath}/register/index"; } </script> </body> </html>

