Question

我正在尝试将归档功能实施到一个网页中，该网页将向网页提交内容，然后在提交后隐藏div。基本上，我在div和标签上创建动态ID。这是我的代码：

<div class="section" id="milestone_<?php echo $milestone['id']; ?>">
  Stuff goes here
    <a href="javascript:void(archiveMilestone(<?php echo $milestone['id']; ?>))" id="archive_milestone_<?php echo $milestone['id']; ?>">(Archive)</a>
</div>

<script>
function archiveMilestone(id)
{
  var dataString = 'remove_milestone='+ id;
    $.post("<?php echo $_SERVER['REQUEST_URI']; ?>",dataString);
    $(document).ready(function(){
      $('a#archive_milestone_' + id).click(function(){
      $('#milestone_' + id).hide('slow');
      })
    });
}
</script>

看起来应该很简单，并且代码已成功发布，但该行不会消失。非常感谢任何帮助，谢谢！

Answer 1

<强> HTML

<div class="section" id="milestone_<?php echo $milestone['id']; ?>">
  Stuff goes here
   <a href="#" class="btnArchive">Archive</a>
</div>

<强>脚本

$(function(){

 $(".btnArchive").click(function(){
   var item=$(this);
   var itemId=item.parent().attr("id").split('_')[1] 
   $.post("yourserverpage.php",{ remove_milestone : itemId } ,function(){
     item.parent().fadeOut("slow"); 
   });       
 });    
});

这是jsFiddle http://jsfiddle.net/hQkVZ/10/

Answer 2

首先，你不应该在函数内部$(document).ready(...。这应该存在于Javascript的最外层。其次，您使用的是PHP，因此在PHP解析之前，您想要选择的项目不存在。请尝试以下方法将事件处理程序主动绑定到元素：

$("#archive_milestone" + id).on("click", function() {
    $("#milestone_" + id).hide("slow");
});

Answer 3

您也可以尝试archiveMilestone(<?php echo json_encode($milestone['id']); ?>)添加json_encode（），因为它可能需要转义。

点击时需要隐藏div

3 个答案: