常用的按钮脚本提交数据 上传按钮更改样式
<form name="form1" id="form1" method="post" onsubmit="return tijiao()" action="<yang:gbookaddurl />"> <script> function tijiao(){ var username=$("#username").val(); var phone=$("#tel").val(); var address=$("#qq").val(); var content=$("#content").val(); if(username=="" || phone=="" || address=="" || content==""){ alert("请填写完整"); return false; } if(phone.length!=11){ alert("手机号码格式不正确"); return false; } $("#form1").submit(); } </script>
通用的页面翻页css:
<!-- 样式1 -->
<div class="page qcfd" style="display: inline-block;">{$page}</div> <style type="text/css"> .page{text-align: center;} .page .num,.page .prev,.page .next,.page .end,.page .first{ width: 45px; height: 40px; border: 1px solid #EBEBEB; margin-left: -1px; color: #8a8a8a; display: inline-block; line-height: 40px; float: left; font-size: 15px; text-decoration: none; margin: 0 2px; border-radius: 6px; } .page .current{ width: 45px; height: 40px; border: 1px solid #EBEBEB; margin-left: -1px; display: inline-block; line-height: 40px; float: left; font-size: 15px; text-decoration: none; margin: 0 2px; border-radius: 6px; background-color: #222A35; color: #fff; border-color: #EBEBEB; position: relative; z-index: 1; } </style>
<!-- 样式2 -->
<style> .page { text-align: center; margin: 20px; color: #171717; } .page span,.page a { border: 1px solid #ccc; padding: 5px 8px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; cursor: pointer; margin-left: 5px; } .page span{ cursor: default; color: #fff; background: #337ab7; border-color: #337ab7; } </style>
<div class="page">{$page}<div>
上传按钮更改样式:a标签下面嵌套一个input:
<style type="text/css"> .file { position: relative; display: inline-block; background: #D0EEFF; border: 1px solid #99D3F5; border-radius: 4px; padding: 4px 12px; overflow: hidden; color: #1E88C7; text-decoration: none; text-indent: 0; line-height: 20px; } .file input { position: absolute; font-size: 100px; right: 0; top: 0; opacity: 0; } .file:hover { background: #AADFFD; border-color: #78C3F3; color: #004974; text-decoration: none; } </style> <a href="" class="file" > <div id="xiao">请选择您要上传的简历(可上传WORD、PDF、PPT)</div> <input type="file" id="file" name="file" onchange="checkFileExtension(this);" /> </a> <script type="text/javascript"> function checkFileExtension(file) { var validExtensions = new Array(".doc", ".docx",".pdf",".ppt"); var fileExtension = file.value; var xiaohe = file.value; fileExtension = fileExtension.substring(fileExtension.lastIndexOf('.')); if (validExtensions.indexOf(fileExtension) < 0) { alert("只能上传 " + validExtensions.toString() + " 后缀文件."); file.value = ""; return false; } else { document.getElementById('xiao').innerText=xiaohe; return true; } } </script>