Question

我正在制作内联评论回复系统

除了我似乎无法将.remove（）应用于我的回复链接创建的DIV之外，它主要起作用 - “取消”回复

我的jQuery代码是：

    <script type="text/javascript">
    $(function() {
        <!-- jQuery inline replies -->
        $("a.reply_link").click(function(){
            this_id = this.id;
            $("#reply_link_div" + this_id).after('<div id="reply_div' + this_id + '" class="reply_div"><form method="post" action="<?php echo SITE_URL . "/comment"; ?>">'+
                                                 '<input type="hidden" name="post_id" value="<?php echo $view[0]['id']; ?>" />'+
                                                 '<input type="hidden" name="post_slug" value="<?php echo $_REQUEST['post']; ?>" />'+
                                                 '<input type="hidden" name="comment_thread" value="' + this_id + '" />'+
                                                 '<strong>reply</strong><div style="padding-bottom:4px;">'+
                                                 '<textarea name="comment_text" id="comment_text' + this_id + '" rows="1" style="width:100%;" /></textarea>'+
                                                 '</div><input type="submit" name="submit" value="submit" />&nbsp;&nbsp;&nbsp;<a href="#" class="reply_cancel_link" id="' + this_id + '">cancel</a></form></div>')
            $("#reply_link_div" + this_id).hide();
            return false;
        });

        <!-- jQuery reply cancel -->
        $('a.reply_cancel_link').click(function() {
            this_id = this.id;
            $('#reply_div' + this_id).remove();
            $("#reply_link_div" + this_id).show();
            return false;
        });
    });
    </script>

我的HTML / PHP代码是：

<table class="comment_table">
    <tr class="comment_text_outer_tr"><td colspan="4" class="comment_text_td">Comment text blah blah
    <div id="reply_link_div<?php echo $comment_id; ?>"><a href="#" id="<?php echo $comment_id ?>" class="reply_link" style="float:right;">reply</a></div>
    </td></tr>
</table>

当用户点击“回复”文本时，jQuery在下面绘制一个reply_div，在这个div里面是一个“取消”回复的链接

当用户点击取消链接时，它应该运行“jQuery reply cancel”下的代码，该代码应该是.remove（）关联的reply_div

当我点击取消时，没有任何反应，没有错误

你能看到我的代码出了什么问题吗？感谢

Answer 1

jquery中的“.click（）”是“.bind（'click'，handler”“link text

的快捷方式

你应该使用“.live（'click'，handler）”来动态创建元素。

Answer 2

当您的点击事件添加到取消按钮时，那些取消按钮实际上还不存在。您应该使用.live('click', cancelAction)。 .live会在创建选择器的任何元素上附加一个侦听器。

Answer 3

您还有多个具有相同ID的a个元素。当我不小心这样做时，我经常会遇到奇怪的，未定义的行为。为您的删除链接提供一个唯一的ID

并不会有什么坏处

<a href="#" class="reply_cancel_link" id="remove_' + this_id + '">cancel</a>

此外，关于.live('click', cancelAction)业务，您还可以创建取消链接并点击点击事件。

var cancelLink = $('<a href="#" class="reply_cancel_link" id="remove_' + this_id + '">cancel</a>');
cancelLink.click(function() {...});

最后，如果您这样做，那么您的取消链接不会将#放入网址栏。

cancelLink.click(function(event) {
  event.preventDefault();
  ...
});

jQuery与.remove（）的麻烦

3 个答案: