AI智能
改变未来

两行jQuery代码实现头像上传预览

//关键的jQuery代码$(\"#file\").change(function() {var url = window.URL.createObjectURL(this.files[0]);$(\"#userImage\").prop(\"src\", url);});

实现文件上传需要在form的enctype属性改为

enctype=\"multipart/form-data\"

正常的文本提交enctype属性为

enctype=\"application/x-www-form-urlencoded\"

示例

<form id=\"\" method=\"post\" action=\"../AccountServlet\" enctype=\"multipart/form-data\"><input type=\"hidden\" name=\"op\" value=\"register\" /><div id=\"prompt3\"><input type=\"file\" id=\"file\" class=\"filepath\" name=\"facepicture\"></div><div class=\"input-wrapper\"><label>账号:</label> <input type=\"text\" id=\"accountName\"name=\"accountName\" placeholder=\"请输入账号\" required=\"required\"><label id=\"accountNameTip\"></label></div><div class=\"input-wrapper\"><label>密码:</label> <input type=\"password\" id=\"accountPwd\"name=\"accountPwd\" placeholder=\"密码\" required=\"required\"></div><input type=\"submit\" class=\"submit\" name=\"\" value=\"注册\" id=\"register\"disabled=\"disabled\"></form>
赞(0) 打赏
未经允许不得转载:爱站程序员基地 » 两行jQuery代码实现头像上传预览