2
私は自分自身を解決しようとしたいくつかの問題があります。しかし、私はしませんでした。私は複数の写真を一度にアップロードできるスクリプトを作成しています。私は最初に1つの入力ファイルフィールドを取得し、誰かがアップロードフィールド用の写真を追加してから新しいアップロードフィールドを自動的に生成すると、JavaScriptを書きました。それは初めてうまく動作しています。新しいアップロードフィールドを生成するのに成功しました。しかし、それは2回目に生成されません。私はあなたがブートストラップに関する知識を持っていると仮定します。ここ 複数のアップロードのために入力タイプ= "ファイル"要素を動的に生成
は私のHTMLコードをここに<input type ="file" class ="fileup 1" id ="file1">
<label for ="file1" id ="lbl_upload">
<span class ="glyphicon glyphicon-plus-sign"></span></label>
<div class ="photos"> </div>
私のJavaScriptコードで、ここで
var count = 1;
$("#file1" + count).on('change', '.fileup', function() {
var files, imagetype, matches;
files = this.files[0];
imagetype = files.type;
matches = ["image/jpeg"];
var str = "#img_nxt" + count;
if (!(imagetype == matches[0])) {
alert("Wrong format");
} else {
$('#lbl_upload').remove();
$('.photos').append("<img id='img_nxt" + count + "' width ='100' height ='100'> ");
//create a new input file element
count++;
$('.photos').append("<input type =\"file\" class =\"fileup " + count + "\" id =\"file" + count + "\"><label for =\"file" + count + "\" id =\"lbl_upload\"><span class =\"glyphicon glyphicon-plus-sign\"></span></label>");
//show picture in image element
var reader = new FileReader();
reader.onload = function(e) {
$(str).attr("src", e.target.result);
}
reader.readAsDataURL(files);
return true;
}
});
私のCSS
[class*="fileup"]{
position:fixed;
top:5000px;
}
私が間違っていたのですか？私のためのソリューションを作るためにあなたの時間を捧げてくれてありがとう。