0

编辑:为了清楚起见,我编辑了这个问题。 编辑 2:我能够解决一半的问题。

下面是一个简单的脚本,用户可以删除他们上传的图片。

取决于数据库中是否保存了图像。应显示切换或上传图标。

问题是,当单击删除按钮时,图片和切换按钮会被删除,但不会显示上传图标(除非刷新页面)。

if (image exists in database) { 

   <div class="toggle" id="toggle<?php echo $image_id ?>"></div>
 }      
 else {
    <div class="upload_icon"  id="upload<?php echo $image_id ?>"></div>
      }

`SQL query to select image in database` 

 //this DIV expands when the toggle button is clicked

 <div class="content" id="image<?php echo $image_id ?>"><img src="<?php echo 
 $path ?>" />  
    <div class="remove content"><a href="#" id="<?php echo $image_id ?>"   
    class="delete_icon">Remove!</a></div>
 </div>

Javascript部分:

$(function(){
$('.delete_icon').on("click",function() 
{
var ID = $(this).attr("id");
var dataString = 'image_id='+ ID;
$this = $(this);
if(confirm("Are you sure you want to delete this image ?"))
{
$.ajax({
type: "POST",
url: "delete.php",
data: dataString,
cache: false,
success: function(html){

$('#image'+ID).remove()
$('#toggle'+ID).remove()
$('#upload'+ID).show();
});
}
return false;
});
});

我在这里想念什么?

4

1 回答 1

1

this一旦你进入函数的上下文,它就不再是链接了success。我保存this并在里面使用它,这应该可以解决问题。

此外,我不确定它find是否真的会起作用。根据您的示例,我不确定#toggle元素实际上是否嵌套在.delete_icon.

如果不是,您可能想要做$('#toggle'+ID)而不是使用 find。无论如何,它是一个 ID 选择器,因此不会影响性能。

$(function(){
  $('.delete_icon').on("click",function() {

    var ID = $(this).attr("id"),
        dataString = 'image_id='+ ID,
        $this = $(this);

    if( confirm("Are you sure you want to remove this image ?") ) {
      $.ajax({
        type: "POST",
        url: "delete.php",
        data: dataString,
        cache: false,
        success: function(html) {

          $this.closest(".content").hide();

          $('#toggle'+ID).hide()

          $('#upload'+ID).show();

        }
      });
    }
    return false;
  });
});
于 2013-09-01T22:30:45.340 回答