Forminput
This afternoon, I helped my colleagues modify this bug:
When uploading multiple images on a page, the input value cannot be used, so after each image is selected, it will be the same as the first image. The following results cannot be displayed:
Baidu has the following idea: first obtain the input, then empty it in a temporary form, and finally Delete the form.
The Code is as follows:
The first step is to generate the binding code for the Image Selection and display parts:
Var img_tmp = '<tr> <td> <input type = "text" name = "code" value = "" style = "width: 90%; display: none; "> <input type =" text "name =" title [] "style =" width: 90%; "/> </td> <input type =" text "name =" sort [] "style =" width: 90%; "/> </td> <input type =" text "name =" num [] "style =" width: 90%; "/> </td> '+' <td> <div class =" file_box "> '+' <input type =" button "class =" btn "value =" select image "/> '+' <input type = "file" name = "fileLOGO" class = "file" id = "" style = "width: 80%; "onchange =" UploadImages (this) "/> '+' </div> </td> '+' <td> <a class =" del "href =" javascript: void (0) "> Delete </a> </td> </tr> ';
In the onchange = "UploadImages (this)" method, we pass in the input for this click to submit:
// Multiimage upload function UploadImages (FileInput) {// var isno = fileChange ($ (FileInput); // if (isno = undefined) {var options = {type: "POST", url :'.. /Handler/AshxUploadFile. ashx? Type = Images ', success: function (msg) {if (msg = "error") {clearImages ($ (FileInput); showerrortip ("Upload Failed ");} else {if (msg! = "Errortype") {clearImages ($ (FileInput); $ (FileInput ). parent (). prev ("img "). attr ("src", strPic + msg); clearImages ($ (FileInput); $ (FileInput ). attr ("style", "") ;}}, error: function (msg) {clearImages ($ (FileInput); $ (FileInput ). attr ("style", ""); showerrortip ("parameter exception! ") ;}}; // Pass options to ajaxForm $ ('form'). ajaxSubmit (options );//}}
At that time, the problem was caused by ignoring the cleaning of input. Therefore, add the clearImages function:
function clearImages(selector) { var fi; var sourceParent; if (selector) { fi = $(selector); sourceParent = fi.parent(); } else { return; } $("<form id='tempForm'></form>").appendTo(document.body); var tempForm = $("#tempForm"); tempForm.append(fi); tempForm.get(0).reset(); sourceParent.append(fi); tempForm.remove(); }
In this way, the input is cleared using the temporary form.