使用jquery和HTML5加载新部件时，javascript在新部件中不工作

您好，正如我的标题所示，我使用以下代码动态加载页面的一部分（此处为左id）

以下是（单击“显示详细信息”链接

问题是：

它可以正常加载…但是javascript不起作用。例如：1.我在下面的小节中使用了一个dispose作为注释，但它没有加载

使用Facebook、Twitter、Yahoo！、Disqs、OpenID或Anonymous添加评论

但是如果你刷新浏览器，它会正确加载…我只是先加载所有需要的脚本…那么为什么它不工作呢

另例如：共享（单击此处）按钮应使用以下代码展开：

<script language="javascript" type="text/javascript">
function showHideDiv()
{
    var divstyle = new String();
    divstyle = document.getElementById("share").style.display;
    if(divstyle.toLowerCase()=="block" || divstyle == "")
    {
        document.getElementById("share").style.display = 'none';
    }
    else
    {
        document.getElementById("share").style.display = 'block';
    }
}
</script> 

函数showHideDiv（）
{
var divstyle=新字符串（）；
divstyle=document.getElementById（“共享”）.style.display；
if（divstyle.toLowerCase（）=“block”|| divstyle==”“）
{
document.getElementById（“共享”）.style.display='none'；
}
其他的
{
document.getElementById（“share”）.style.display='block'；
}
}

但它不是！…但如果我刷新页面（即再次加载url），它就会工作

我主要希望讨论评论的功能能够正常工作

<div class="entry">
  <h2>Add a Comment using Facebook, Twitter, Yahoo!, DISQUS, OpenID or Anonymus </h2>
  <p>


  <div id="disqus_thread"></div>
<script>
    /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
    var disqus_shortname = '[written here]'; // required: replace example with your forum shortname

    // The following are highly recommended additional parameters. Remove the slashes in front to use.
     var disqus_identifier = 'page=show_song_details.php&songid=<?php echo $sid ?>&n=0&back=no';
     var disqus_url = '<?php echo $main_root.$_SERVER['REQUEST_URI']; ?>';
    var disqus_developer = 1 ;
    /* * * DON'T EDIT BELOW THIS LINE * * */
    (function() {
        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
        dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
    })();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>

  </p>


</div>

使用Facebook、Twitter、Yahoo！、Disqs、OpenID或Anonymous添加评论

/***配置变量：粘贴到网页前编辑***/
var discus_shortname='[Write here]'；//必需：将示例替换为您的论坛shortname
//以下是强烈建议的其他参数。请删除前面的斜杠以使用。
var discus_identifier='page=show_song_details.php&songid=&n=0&back=no'；
var discus_url=''；
var Discus_developer=1；
/***请勿在此行下方编辑***/
（功能（）{
var dsq=document.createElement（'script'）；dsq.type='text/javascript'；dsq.async=true；
dsq.src='http://'+discus_shortname+'.discus.com/embed.js'；
（document.getElementsByTagName（'head'）[0]| | document.getElementsByTagName（'body'）[0]）.appendChild（dsq）；
})();
请启用JavaScript以查看

功能

showHideDiv（）

在主页（列表）上不可用，仅在子页（单曲）上可用。 在下面的代码中，您只检索页面dom的一个子集，这意味着您在页面其余部分创建的JS函数没有运行

$("#left").fadeTo(100,1);
var data = $(data).find( '#left' );
$("#left").html(data);

您可以通过在主页中包含所需的JS函数来修复此问题

我很久以前读到的一个可能的解决方案是将函数赋值给一个变量，如下所示：

var showHideDiv = function() {...};

这让我觉得有点脏……但是对

数据
进行评估怎么样呢

$("#left").fadeTo(100,1);
var data = $(data).find( '#left' );
$("#left").html(data);

data.find('script').each(function() {
  eval($(this).text());
});

编辑：也许您可以试试jQuery的
globalEval
函数

$("#left").fadeTo(100,1);
var data = $(data).find( '#left' );
$("#left").html(data);

data.find('script').each(function() {
  $.globalEval($(this).text());
});

函数
showHideDiv（）
在主页（列表）上不可用，仅在子页（单曲）上可用。
在下面的代码中，您只检索页面dom的一个子集，这意味着您在页面其余部分创建的JS函数没有运行

$("#left").fadeTo(100,1);
var data = $(data).find( '#left' );
$("#left").html(data);

您可以通过在主页中包含所需的JS函数来修复此问题

我很久以前读到的一个可能的解决方案是将函数赋值给一个变量，如下所示：

var showHideDiv = function() {...};

这让我觉得有点脏……但是对
数据
进行评估怎么样呢

$("#left").fadeTo(100,1);
var data = $(data).find( '#left' );
$("#left").html(data);

data.find('script').each(function() {
  eval($(this).text());
});

编辑：也许您可以试试jQuery的
globalEval
函数

$("#left").fadeTo(100,1);
var data = $(data).find( '#left' );
$("#left").html(data);

data.find('script').each(function() {
  $.globalEval($(this).text());
});

尝试将onclick替换为jquery live（），看看它是否有效。此外，您的showHideDiv可以缩减为一行：

$("#share").toggle()
$（“#共享”）.toggle（）尝试用jquery live（）替换onclick，看看它是否有效。此外，您的showHideDiv可以减少为一行：

$("#share").toggle()
$（“#共享”）.toggle（）我认为问题在于事件的触发顺序。当您正常加载页面时，Discussion js很可能在
load
触发时运行。因此，当您使用ajax加载时，它不会触发
load
事件。相反，您必须在调用BackFunctionLoadNextBackinPage方法或使用另一个回调

$.post(url,parm,function(data) {
    callBackFunctionLoadNextBackInPage(data);

    // Initialize here
    $('.element').plugin_initializer();

},'html');

我认为问题在于事件的触发顺序。当您正常加载页面时，Discussion js很可能在
load
触发时运行。因此，当您使用ajax加载时，它不会触发
load
事件。相反，您必须在调用BackFunctionLoadNextBackinPage方法或使用另一个回调

$.post(url,parm,function(data) {
    callBackFunctionLoadNextBackInPage(data);

    // Initialize here
    $('.element').plugin_initializer();

},'html');

问题是，每当您从HTML字符串创建jQuery对象以对其执行一些DOM操作时，jQuery就会去掉
标记，在您的例子中是
.find（）

你最好将整个HTML作为文本阅读，然后使用正则表达式将其切碎，并将相关部分放入文档中。你还应该考虑重新设计项目的一部分，因为在我看来，用部分脚本加载外部页面的一部分不是一个好的做法，可能很难长期维护。Unless当然，这是一个经过深思熟虑的模块化设计，你知道你在做什么

这个问题完全是另一个线程的重复，尽管由于悬赏，我不能投票关闭它。请看我的答案，看看它是否有用：
问题是，每当您从HTML字符串创建jQuery对象以对其执行一些DOM操作时，jQuery都会去掉
标记，在您的例子中是
.find（）

你最好将整个HTML作为文本阅读，然后使用正则表达式将其切碎，并将相关部分放入文档中。你还应该考虑重新设计项目的一部分，因为在我看来，用部分脚本加载外部页面的一部分不是一个好的做法，可能很难长期维护。Unl当然，这是一个经过深思熟虑的模块