前端常知识点

点击图片回显，而不是点击上传按钮，可以限制图片大小

<img src="" style="text-align: center;" id="tu" width="100%" height="100px" onclick="file.click()" />

<input type="file" name="zhengmian" id="file" style="display: none" onchange="changeImg(this)" />

function changeImg(t) {

      previewImage(document.getElementById('tu'), t);

}

function previewImage(obj, file) {

var fileSize = file.files[0].size;

if(fileSize>1){

      alert(“图片大小不能大于1M”)

}else{

         var reader = new FileReader();

         reader.onload = function(evt) { //这个调用应该是异步进行的

              obj.src = evt.target.result; //似乎是读取目标文件的二进制数据，然后存入指定img的内存区域，

         };

         reader.readAsDataURL(file.files[0]);

      }

     

}

 

 

清空输入框

function resetAll() {

     $("#myform").find('input[type=text],select,input[type=hidden]').each(function() {

         $(this).val('');

     });

}

 

var formData = new FormData(document.getElementById("form")); //批量获取form的值，根据input的name

 

进入页面就刷新一次当前页面

$(document).ready(function () {

      /*进入页面就刷新一次当前页面，很少用*/

     if(location.href.indexOf("#reloaded")==-1){

        location.href=location.href+"#reloaded";

        location.reload();

    }

 }）

 

/*设置背景图填充整个div*/

<div style="background-size: 100% 100%;background-image: url(img/bg.png); ">

      应支付金额                      

</div>

 

/*设置输入框背景图片，类似： */

<style type="text/css">

      .user {

           background-image: url(img/271542324711332.jpg);

           /*设置小图标*/

           background-size: 25px 25px;

           /*小图标的大小*/

           background-position: 80% 4px;

           /*小图标在input的位置*/

           background-repeat: no-repeat;

           /*背景小图标不重复*/

                 padding: 8px 10px 8px 40px;

                 /*设置input内边距*/

                 /*设置input样式好看*/

                 border: 1px solid #ddd;

                 margin: 30px;

                 width: 220px;

           }

</style>

<input type="text" class="user" style="border-top-left-radius: 5px;" />

 

/*******************************************背景图片*****************************************/

div {

background : url (/images/bg.jpg) no-repeat fixed ;

background-position-y: bottom ;

}

代码详解：

div {

background-image : url (/images/bg.jpg); /*设置div层的背景图片*/

background-repeat : no-repeat ; /*背景图片不重复显示*/

background-repeat : repeat ; /*背景图片横向及纵向重复*/

background-repeat : repeat-x ; /*背景图片横向重复*/

background-repeat : repeat-y ; /*背景图片纵向重复*/

background-attachment : fixed ; /*固定背景图片*/

background-attachment : scroll ; /*滚动背景图片*/

background-position-x: left ; /*背景图片在横向的最左方显示*/

background-position-x: right ; /*背景图片在横向的最右方显示*/

background-position-y: top ; /*背景图片在纵向的最上方显示*/

background-position-y: bottom ; /*背景图片在纵向的最下方显示*/

}

 

以上若有理解不到位的，望各位大佬及时指出，谢谢！QQ：820648091