Submit提交动态改变的文本框的值
程序员文章站
2022-05-29 19:35:01
...
Submit提交JavaScript动态改变的文本框的值
模拟实现CSDN发布博客时，通过JavaScript动态添加文章标签的功能，如下图所示：
- 页面代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript">
function setInputValue() {
var nameInput = document.getElementById("uname");
nameInput.value = 'zhangsan';
}
function submitFun() {
var form=document.forms[0];
form.method="post";
form.action="#";
form.submit();
}
</script>
</head>
<body>
<form >
<input type="text" name="uname" id="uname">
<input type="button" value="设置值" onclick="setInputValue()"><br>
<input type="text" name="uage"><br>
<input type="button" value="提交" onclick="submitFun()">
</form>
</body>
</html>
-效果
初始页面：
单击设置值按钮：
输入年龄后，单击提交按钮：
注意：设置uname不可编辑
参考博客：设置input 不可编辑的方法
-
如果采用disabled 设置不可编辑
<input type="text" disabled name="uname" id="uname">则无法获取用户单击设置按钮后给uname设置的值
-
如果采用readonly ，设置不可编辑
<input type="text" readonly name="uname" id="uname"> 或 <input type="text" readonly unselectable="on" name="uname" id="uname">则可以获取用户单击设置按钮后给uname设置的值
上一篇： PHP查看服务器信息内存、负载等
下一篇： wangEditor富文本的使用