html**部分:**:思路:下面**中我利用css的z-index屬性將input="
file」標籤隱藏在了id=btnselect元素下面,通過觸發a標籤的點選後,彈出檔案選擇框。下面的masklayer用於點選確認按鈕後的彈出層,避免使用者重複點選確認按鈕。
複製**
**如下:"wp
"class="
warpper
">
"btnselect
">單擊選擇要上傳的**
"uploadfile
" type="
file
" name="
myphoto
" />
"btnconfirm
"class="
btn" >確認上傳 "
masklayer
"class="
mask-layer
" style="
display:none;
">
正在上傳中...
false
,滿足以上3個條件後,在dom中生成預覽,新增img元素,然後利用createobjecturl()方法獲取預覽路徑。
**:
複製**
**如下:
//獲取資料的url位址
function createobjecturl(blob)
else
if(window.webkiturl)
else }
//檔案檢測
function checkfile()
//檢測檔案型別
if(file.type.indexof('
image
') === -1
) //
計算檔案大小
var size = math.floor(file.size/1024
); if (size > 5000
) ;
//新增預覽
$$("
btnselect
").innerhtml = "
\"/>";
};
H5常用新特性
注意 這些新特性都有相容性的問題,基本是ie9 以上版本的瀏覽器才支援,如果不考相容性問題,可以大量使用這些新特性 html5新增的語義話標籤 html新增的多 標籤 屬性值描述 autoplay autoplay controls controls width pixels height pxlo...
h5新特性 canvas標籤(補充)
上下文物件 painter 1.透明度 語法 painter.globalalpha 0 1 任何操作都要在fill 之前 2.線性 1 設定線寬 painter.linewidth number 2 端點 painter.lincap 端點型別 型別 butt 無端點,round 圓弧端點 squ...
H5新特性 本地儲存
注意 本地儲存呼叫者必須統一,用臨時儲存儲存的資料,只有臨時儲存才能找到 localstorage 永久儲存 相對 其中的資料不隨著瀏覽器的開關而改變 sessionstorage 臨時儲存 相對 當瀏覽器關閉 當前頁面關閉時,資料消失,頁面重新整理時不會影響 兩者區別 local 和 sessio...