常用的按钮脚本提交数据 上传按钮更改样式

<form name="form1" id="form1" method="post" οnsubmit="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:

<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>

 上传按钮更改样式: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>

 

转载于:https://www.cnblogs.com/xiaohe520/articles/11201963.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值