0
私のコードは非常に長いです。私はここに皆さんを見せてくれません。私はちょうどのみアップロードした画像をどのボックスで削除するには？
私のjavascriptのこのようjavascriptのコードを示しています。私は、追加、削除、編集画像には、show非表示を使用しhttp://www.phpfiddle.org/main/code/adjv-sfuy
：
<script type="text/javascript">
let current = 0;
for(let i = 0; i < 5; i++) {
$('#thumbnail-view-delete-'+i).click(function(){
current -= 1;
$('input[name="photo-'+i+'"]').val('');
document.getElementById("thumbnail-view-li-"+current).style.display = "none";
document.getElementById("thumbnail-upload-li-"+current).style.display = "";
document.getElementById("thumbnail-upload-li-"+(current+1)).style.display = "none";
document.getElementById("thumbnail-slot-li-"+(current+1)).style.display = "";
});
}
var editClicked = false;
for(let i = 0; i < 5; i++) {
$('#thumbnail-view-edit-'+i).click(function(){
editClicked = true;
$('input[name="photo-'+i+'"]').click();
});
}
for(let i = 0; i < 5; i++) {
$('#thumbnail-view-add-'+i).click(function(){
editClicked = false;
$('input[name="photo-'+i+'"]').click();
});
}
for(let i = 0; i < 5; i++) {
var reader = new FileReader();
$('input[name="photo-'+i+'"]').change(function (e) {
let indexPhoto = i;
current += 1;
reader.onload = function(){
imageProducIsLoaded(indexPhoto);
};
reader.readAsDataURL(e.target.files[0]);
});
}
function imageProducIsLoaded(indexPhoto) {
$('#thumbnail-view-'+indexPhoto).attr('src', reader.result);
if (!editClicked) {
document.getElementById("thumbnail-upload-li-"+indexPhoto).style.display = "none";
document.getElementById("thumbnail-view-li-"+indexPhoto).style.display = "";
if((indexPhoto+1) < 5) {
document.getElementById("thumbnail-upload-li-"+(indexPhoto+1)).style.display = "";
document.getElementById("thumbnail-slot-li-"+(indexPhoto+1)).style.display = "none";
}
}
};
</script>
あなたはここに私の完全なコードとデモを見ることができます。あなたがデモを見れば、それは働いています。画像は、編集し、削除して
を追加しました。しかし、ユーザーが画像を削除すると私の問題は、ユーザが画像
を削除したときに、最後のボックス上の画像が削除されている。することができますユーザーが画像を削除すると、削除ボタンをクリックした画像が削除されます。
たとえば、私は5画像を入力します。 3に画像を削除する場合は、3への画像は、私はいくつかの日のためにコードを変更しようとしてきたが、私は解決策
が私を助けることができる誰もがあります見つけることができますか？
を削除しましたか
..あなたを助ける、これを参照してください。 +記号。これは簡単で、実際にユーザーエクスペリエンスに影響を与えません。 –
また、jQueryを使用している場合は、 'document.getElementBy'のようなことをするのではなく、jqueryに固執してみてください。' $（ "＃blah"） 'を使用してください。また、divを表示/非表示にしている間に、現在のコードで物を移動させる効果を実際に得ることはできません。 –
@A。ラウ、いいアイデアです。しかし、これは私のクライアント要求です。ジェイソンの答えを見てください。それは私の問題を軽減しました。しかし、まだ欠点があります。 –