Question

以下是显示删除邮件“$(".imagemsg" + counter).html(data);”的代码。但它只在第二行删除文件后显示删除消息，这是不正确的，它只应显示在文件被删除的行中。

例如，如果文件是从第3行删除的，则消息应显示在第3行，如果文件从第6行删除，则应显示第6行的删除消息等。但此刻没有删除文件的哪一行，只有第二行显示删除消息。

   var counter = 0;

function stopImageUpload(success, imagefilename){

      var result = '';
      counter++;

      if (success == 1){
         result = '<span class="imagemsg'+counter+'">The file was uploaded successfully!</span><br/><br/>';      
         $('.listImage').eq(window.lastUploadImageIndex).append('<div>' + htmlEncode(imagefilename) + '<button type="button" class="deletefileimage" image_file_name="' + imagefilename + '">Remove</button><br/><hr/></div>'); 
      }
      else {
         result = '<span class="imageemsg">There was an error during file upload!</span><br/><br/>';
      }


      $(".deletefileimage").on("click", function(event) {

         var image_file_name = $(this).attr('image_file_name');

    jQuery.ajax("deleteimage.php?imagefilename=" + image_file_name)
      .done(function(data) {
        $(".imagemsg" + counter).html(data);
       });

       $(this).parent().remove();

    });

      return true;   
}

结果变量在imageupload.php中调用：

CALLBACK：

  <script language="javascript" type="text/javascript">window.top.stopImageUpload(<?php echo $result ? 'true' : 'false'; ?>, '<?php echo $_FILES['fileImage']['name'] ?>');</script>

Answer 1

这种方法总体上并不理想。更好的方法可能是给他们所有相同的类，然后使用parent，find，children等内容来查找相应的元素。

但是，如果没有大规模检修你的代码，我应该修复它：

var _counter = counter;

$('.listImage').eq(window.lastUploadImageIndex).find(".deletefileimage").on("click", function(event) {
    var image_file_name = $(this).attr('image_file_name');

    jQuery.ajax("deleteimage.php?imagefilename=" + image_file_name)
        .done(function(data) {

        $(".imagemsg" + _counter).html(data);
    });

    $(this).parent().remove();
});

基本上，点击处理程序仅附加到相应的按钮，并使用相应的counter值。

它仅在第二行显示删除消息

1 个答案: