日度归档:2020年6月12日

html标签button如何使用js进行表单验证和提交呢?


摘要:
下文讲述html标签中Button借助jsonclick进行表单验证和提交的示例分享,如下所示:

例:

 <html>
<head>
<meta charset='utf-8' />
<script> 
window.onload = function(){
  var b = document.getElementById("btn");	
         b.onclick =function (){ checkForm();}
}

function checkForm(){
        //判断用户名是否为空
        if(document.form1.txtUserName.value==""){
                window.alert("用户名不能为空");
        }else if(document.form1.txtUserName.value.length<5 || document.form1.txtUserName.value.length>20){
            window.alert("用户名长度必须介于5-50个字符之间!");
        }else{
            //使用form对象的submit()方法,实现提交。
            document.form1.submit();        
        }
  }
 </script>
 </head>
 <body>
  <form name="form1" method="get" action="http://www.maomao365.com">
  用户名:<input type="text" name="txtUserName" />
  密码:<input type="password" name="txtPwd" />
  <input type="button" id="btn" value="提交表单"  />
  </form>
 </body>
</html>
html button结合Js对表单验证示例分享

html button结合Js对表单验证示例分享

css 如何将table表格中tr同tr之间间隔开呢?


摘要:
下文讲述使用css代码将table表格中的tr分离的方法分享,如下所示:

实现思路:
    使用  
      border-collapse:separate;
      border-spacing:10px 50px; 
     即可将table中tr进行分离
    如下所示:

例:
设置table tr之间间距为10px

 
<meta charset="UTF-8">
<p>
 maomao365.com <br />
 table表中tr分离的方法分享
</p>
<hr /> 
<style>
 table{
  width:180px;
  border-collapse:separate;
  border-spacing:0px 10px;
  /*0代表列间距 10代表行间距*/
 }
</style>

<table >
 <tr bgcolor="green;"><td>keyId<td>备注</tr>
 <tr bgcolor="green;"><td>1<td>猫猫教程</tr>
 <tr bgcolor="green;"><td>2<td>maomao365.com </tr>
</table>
css 设置table中tr之间的间隔

css 设置table中tr之间的间隔