新页面加载后，Document.ready函数无法正常工作

Question

我的代码是这样的，

page1.html

<button onclick="loadNextpage();">
<div id="main">
</div>

function loadNextpage()
{
    /*I am calling my back end code here which gives page2.html*/
    $("#main").html(response);
}

page2.html

<script type="text/javascript">
    $(document).ready(function(){
        alert("document.ready in social")
        jQuery("abbr.timeago").timeago();
    });
</script>

<div class"submain">
<time>
     <abbr class="timeago" title=${rec[5]}>${rec[5]}</abbr>
</time>
</div>

我在指定的div中获取了page2.html。但问题是document.ready函数中的两行无法正常工作。在这种情况下请帮助我。 谢谢

Answer 1

你的page2是通过ajax加载的，所以在这种情况下，你的page2脚本应该在那个元素之后，它应该是这样的：

<div class"submain">
<time>
     <abbr class="timeago" title=${rec[5]}>${rec[5]}</abbr>
</time>
</div>

<script type="text/javascript">

        alert("document.ready in social")
        jQuery("abbr.timeago").timeago();

</script>

并且这一行是错误的，这是在发布问题时输入错误：

$(#main).html(response);

它应该是：

$("#main").html(response);

Answer 2

$(#main).html(response);
这行不是使用jquery的正确方法 用这个：
$("#main").html(response);
<div class"submain">//another bug

http://api.jquery.com/category/selectors/关于jquery选择器