在 JQuery 中使用 appendTo() 添加元素然后立即将其删除...解决方案？

Question

这可能是一个菜鸟问题，但我如何实现下面的 appendTo() 函数并没有按预期工作。基本上，它添加了元素并立即再次将其删除。它是眨眼的，你会错过它的东西。

谁能理解为什么会发生这种情况？

这里是函数被调用的地方：

<?php foreach ($words as $word) {
echo    "<li class='$word[0]'><a href='' onclick='add_to();'>$word</a></li>";
} 

这是函数本身（几乎取自 jQuery 教程网站：

function add_to () {
        $('<h1>Test</h1>').appendTo('.ad_text');
    }

我的第一个想法是调用了一个调用 document.ready() 的脚本，它消除了 add_to() 函数？该脚本位于 add_to() 之上，是这样的：

$(document).ready(function(){

        //when a link in the filters div is clicked...
        $('#filters a').click(function(e){

            //prevent the default behaviour of the link
            e.preventDefault();

            //get the id of the clicked link(which is equal to classes of our content
            var filter = $(this).attr('id');

            //show all the list items(this is needed to get the hidden ones shown)
            $('#content ul li').show();

            /*using the :not attribute and the filter class in it we are selecting
            only the list items that don't have that class and hide them '*/
            $('#content ul li:not(.' + filter + ')').hide();

        });

    });

那里可能有一些冲突的代码？抱歉 - Javascript 新手，正在尝试快速拼凑一些东西。

TIA，安迪

Answer 1

您的链接正在重新加载页面。 试试这个（添加 # 到 href 属性）

foreach ($words as $word) {
    echo    "<li class='$word[0]'><a href='#' onclick='add_to();'>$word</a></li>";
}

Answer 2

我不能肯定，但您可能会用 document.ready 函数中的函数覆盖您在 onclick 属性中定义的点击函数。