滾動條的自定義化，往往在做移動web的時候，能為我們的項目增添不少風采，而且通過為其添加-webkit-overflow-scrolling : touch; 的css屬性，使其有着如同ios系統瀏覽器中bounce的效果，這里的話，提供一個仿ios風格自定義滾動條的demo，代碼如下：
- <!DOCTYPE html>
- <html lang="zh">
- <head>
- <meta charset="UTF-8" />
- <title>Document</title>
- <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
- </head>
- <body>
- <div>
- 上傳文件 ： <input type="file" name="file" multiple id="fileId" />
- <button type="submit" name="btn" value="提交" id="btnId" onclick="check()">提交</button>
- </div>
- <script type="text/javascript">
- function check() {
- var objFile = document.getElementById("fileId");
- if(objFile.value == "") {
- alert("不能空")
- }
- var files = $('#fileId').prop('files'); //獲取到文件列表
- console.log(files.length);
- if(files.length == 0) {
- alert('請選擇文件');
- } else {
- for(var i = 0; f = files[i]; i++) {
- var reader = new FileReader(); //新建一個FileReader
- reader.readAsText(files[i], "UTF-8"); //讀取文件
- reader.onload = function(evt) { //讀取完文件之后會回來這里
- var fileString = evt.target.result; // 讀取文件內容
- console.log(fileString)
- }
- }
- }
- }
- </script>
- </body>
- </html>