标签：return 为空 表单 getElementById 三种 nbsp 提交 按钮 document
一、使用普通button按钮+onclick事件+事件中编写代码
<body>
<form id='myform1' name="myform2" action="http://www.baidu.com" method="get">
姓名：<input type="text" name="test" id="uname"/> <span id="msg" style="color: red;"></span><br />
<!--通过js事件：sub()提交表单-->
<input type="button" onclick="sub();" value="提交表单1" />
</form>
<script type="text/javascript">
//使用普通button按钮+onclick事件+事件中编写代码:
function sub(){
//校验数据合法性
var uname = document.getElementById("uname").value;
if(uname == null || uname.trim() == ""){
//提示用户用户名不能为空
document.getElementById("msg").innerHTML = "用户名不能为空";
return;
}
//手动提交表单
document.getElementById("myform1").submit();
}
</script>
</body>
二、使用submit按钮 + onclick="return 函数()" + 函数编写代码
最后必须返回：return true|false;
<body>
<form id='myform2' name="myform2" action="http://www.baidu.com" method="get">
姓名：<input type="text" name="test" id="uname2"/> <span id="msg2" style="color: red;"></span><br />
<!--通过js事件：sub()提交表单-->
<input type="submit" onclick="return sub2();" value="提交表单2" />
</form>
<script type="text/javascript">
//使用submit按钮 + onclick="return 函数()" +函数编写代码:
function sub2(){
//校验数据合法性
var uname2 = document.getElementById("uname2").value;
//数据非空判断
if(uname2 == null || uname2.trim() == ""){
//提示用户用户名不能为空
document.getElementById("msg2").innerHTML = "用户名不能为空";
return false;
}
return true;
}
</script>
</body>
三、使用submit按钮/图片提交按钮 + 表单onsubmit="return 函数();" +函数编写代码
最后必须返回：return true|false;
<body>
<form id='myform3' name="myform2" action="http://www.baidu.com" method="get" onsubmit ="return sub3()">
姓名：<input type="text" name="test" id="uname3"/> <span id="msg3" style="color: red;"></span><br />
<!--通过js事件：sub()提交表单-->
<input type="submit" value="提交表单3" />
</form>
<script type="text/javascript">
// 使用submit按钮/图片提交按钮 + 表单onsubmit="return 函数();" +函数编写代码:
function sub3(){
//校验数据合法性
var uname3 = document.getElementById("uname3").value;
//数据非空判断
if(uname3 == null || uname3.trim() == ""){
//提示用户用户名不能为空
document.getElementById("msg3").innerHTML = "用户名不能为空";
return false;
}
return true;
}
</script>
</body>
标签：return,为空,表单,getElementById,三种,nbsp,提交,按钮,document 来源： https://www.cnblogs.com/wml-it/p/15845536.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。