如何只刪除正確的文本輸入？

Question

當上傳完成時，我有一個jquery函數，它將文件的名稱存儲在一個字符串中，並且它是文本輸入中的id。現在在函數的底部，如果用戶點擊了deletevideofile按鈕，則假定刪除屬於該刪除按鈕的文件名和文本輸入。但問題是，即使認爲它只刪除了正確的文件名，它也會刪除所有文本輸入，而不是僅刪除正確的文本輸入。

我的問題是我怎麼才能只刪除正確的文本輸入，當刪除按鈕被點擊？

下面是代碼：

function stopVideoUpload(success, videoID, videofilename){ 

     var result = ''; 
     videocounter++; 

     if (success == 1){ 
     result = '<span class="videomsg'+videocounter+'">The file was uploaded successfully</span>'; 
      $('.listVideo').eq(window.lastUploadVideoIndex).append('<input type="text" name="vidid" value="' + videoID + '" />'); 
      $('.listVideo').eq(window.lastUploadVideoIndex).append('<div>' + htmlEncode(videofilename) + '<button type="button" class="deletefilevideo" video_file_name="' + videofilename + '">Remove</button><br/><hr/></div>');  } 

    var _videocounter = videocounter; 

$('.listVideo').eq(window.lastUploadVideoIndex).find(".deletefilevideo").on("click", function(event) { 
    var video_file_name = $(this).attr('video_file_name'); 

    jQuery.ajax("deletevideo.php?videofilename=" + video_file_name) 
     .done(function(data) { 

     $(".videomsg" + _videocounter).html(data); 
    }); 

     $(this).parent().siblings('input[name="vidid"]').andSelf().remove(); 
}); 


     return true; 
} 

Answer 1

除了具有名稱「vidid」生成的輸入框，添加一個id屬性到<input>元件具有每個視頻的唯一ID。

然後在你的.remove()線匹配屬於正在生成<input>的id改變選擇在.siblings()功能。

下面是一些JavaScript示例。 ，修改它以滿足您的需求：

function stopVideoUpload(success, videoID, videofilename) { 

    var result = '', _videocounter; 
    videocounter++; 

    if (success == 1) { 
     result = '<span class="videomsg'+videocounter+'">The file was uploaded successfully</span>'; 
     $('.listVideo').eq(window.lastUploadVideoIndex).append('<input type="text" name="vidid" id="'+videoID+'" value="' + videoID + '" />'); 
     $('.listVideo').eq(window.lastUploadVideoIndex).append('<div>' + htmlEncode(videofilename) + '<button type="button" class="deletefilevideo" data-videoID="'+videoID+'" data-video_file_name="' + videofilename + '">Remove</button><br/><hr/></div>'); 
    } 

    _videocounter = videocounter; 

    $('.listVideo').eq(window.lastUploadVideoIndex).find(".deletefilevideo").on("click", function(event) { 
     jQuery.ajax("deletevideo.php?videofilename=" + $(this).attr('data-video_file_name')).done(function(data) { 
      $(".videomsg" + _videocounter).html(data); 
     }); 

     $(this).parent().siblings('#'+ $(this).attr('data-videoID')).andSelf().remove(); 
    }); 


    return true; 
}