AJAX不工作的第一次点击，需要点击两次

Question

更新：

现在的问题是用萤火虫后我发现的第一个元素获取title属性和其他元素不和徘徊后，在任何链接的第一个链接的标题属性消失任何想法？

我有它打开页面，当我点击这样的链接：

<a class="pictures" href="#" onClick="MM_openBrWindow('content_image.php','images','menubar=yes,scrollbars=yes,resizable=yes,width=650,height=700')" title="Images"></a> 

这个页面有存储在一个文件夹中的图片：

$open = opendir($path); 
while($images = readdir($open)){ 
    if ($images != "." && $images != "..") { 
    $allimages[] = $images; 
    } 
} 
foreach($allimages as $val){ 
    ?> 
    <div class="uploaded_image"><img src="../content_img/<?php echo $val; ?>" align='middle' width='150px' height='100px'>   
     <form><a href="#" title="<?php echo $val; ?>" class="del_img"><img src="images/delete.gif"/></a> <textarea name='text_area' rows=1 cols=20 >../content_img/<?php echo $val; ?></textarea> <input type='button' value='select path' onClick='javascript:this.form.text_area.focus();this.form.text_area.select();'> Copy path and paste in image path field </form></div> 
     <?php 
} 
closedir($open); 
?>   

我想删除使用图片与href定期链接，具有以下属性的页面：

?do=delete&img=<?php echo $val; ?> 

和n unlink()的图像。但是，只要我不点击鼠标悬停在链接上，图像就会被删除。我不知道为什么。

我尝试使用AJAX来做到这一点：

$(document).ready(function(e) { 
$("div.uploaded_image").on("click","a.del_img",function(e){ 
    e.preventDefault(); 
    var img = $(this).attr("title"); 
    var qst = "?img="+img+"&path=content_img"; 
    var ajax = false; 
    ajax = new XMLHttpRequest(); 
    ajax.open("post","del_image.php"+qst); 
    ajax.onreadystatechange = function(){ 
     if(ajax.readyState == 4 && ajax.status == 200){ 
     } 
    } 
    ajax.send(null); 
    setTimeout(ref,1500); 
}); 
}); 
function ref(){ 
window.location = "content_image.php" 
} 

这个PHP代码工作使用AJAX来删除：

$img = $_REQUEST['img']; 
$path = $_REQUEST['path']; 
unlink("../".$path."/".$img); 

当我点击删除链接上的第一次它不”工作。我必须再次点击删除图像。请帮忙吗？

Answer 1

$open = opendir($path); 
while($images = readdir($open)){ 
    if ($images != "." && $images != "..") { 
    $allimages[] = $images; 
    } 
} 
foreach($allimages as $val){ 
    ?> 
    <div class="uploaded_image"><img src="../content_img/<?php echo $val; ?>" align='middle' width='150px' height='100px'>   
     <form><a href="Javascript:void(0);" title="<?php echo $val; ?>" class="del_img"><img src="images/delete.gif"/></a> <textarea name='text_area' rows=1 cols=20 >../content_img/<?php echo $val; ?></textarea> <input type='button' value='select path' onClick='javascript:this.form.text_area.focus();this.form.text_area.select();'> Copy path and paste in image path field </form></div> 
     <?php 
} 
closedir($open); 
?>   

在标签中使用此代码

Answer 2

变化

$("div.uploaded_image").on("click","a.del_img",function(e){ 
    e.preventDefault(); 

到

$("div.uploaded_image a").click(function(e){ 
    e.preventDefault(); 
...