使用AJAX加载包含html / js的页面

时间:2011-03-21 21:07:06

标签: php javascript jquery html ajax

我正在尝试使用AJAX加载php页面。问题是它内部有一个“共享此”按钮,它使用在同一页面中加载的Javascript脚本。

当我使用AJAX加载页面时,“共享此”按钮无法正确显示,因为未加载Javascript内部。

关于如何在页面中加载Javascript的任何想法?

谢谢, 阿兰

P.S。 - 我正在使用jQuery的javascript

更新:

我仍然无法让它发挥作用。这是我要加载的html / js:

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style ">
<a href="http://www.addthis.com/bookmark.php?v=250&amp;username=leblon" class="addthis_button_compact" addthis:url="<?php the_permalink(); ?>" addthis:title="<?php the_title(); ?>">Share
<span class="at300bs at15t_compact"></span>
</a>
<span class="addthis_separator">|</span>
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_preferred_3"></a>
<a class="addthis_button_preferred_4"></a>
</div>


<script type="text/javascript">var addthis_config = {"data_track_clickback":true};</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=leblon" id="the-script"></script>
<!-- AddThis Button END -->

以下是我的javascript文件的片段:

$.ajax({ url: theURL + link+'/?from=us', success: function(html){
  $('#drink').html(html);
}

任何?

3 个答案:

答案 0 :(得分:1)

EDIT /重做:

在AddThis中注册,似乎它的实现与您的实现略有不同。

要加载的HTML

<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">stLight.options({publisher:'xxx-xxx-xx-xx-xx'});</script>

<span class="st_twitter_large" displayText="Tweet">
</span><span class="st_facebook_large" displayText="Facebook"></span>
<span class="st_ybuzz_large" displayText="Yahoo! Buzz"></span>
<span class="st_gbuzz_large" displayText="Google Buzz"></span>
<span class="st_email_large" displayText="Email"></span>
<span class="st_sharethis_large" displayText="ShareThis"></span>

AJAX SIDE(加载其他页面)

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>

<script tyle="text/javascript">
 var addthis_config = {"data_track_clickback":true};
$(document).ready(function(){
    $.ajax({ url:'test.php', success: function(html){
    $('#content').html(html);

}});
});
</script>
</head>
<body>
<div id="content" style="width:400px;border:1px solid black;height:300px;margin:auto"></div>
</body>
</html>

你可能有一个旧版本,并且执行ajax时按钮不是init()。

答案 1 :(得分:0)

这取决于您将页面内容添加到当前页面的方式。

这样的事情应该有效:

$.get('/path/to/new/page', function(data){
    $('#someDiv').html(data);
});

如果这不起作用,那么拉出页面中的脚本标签将无法正确解释。我相信我曾经遇到过这个问题,绕过jQuery可能有所帮助:$('#someDiv')[0].innerHTML = data,或者如果这不起作用,你下一步就是使用正则表达式来提取脚本标签,手动下载并评估那些

答案 2 :(得分:0)

您可以尝试添加AJAX onComplete / success事件,一旦触发调用针对分享按钮的js函数。

$.ajax({
  url: "YourPage.php",
  context: document.body,
  success: function(){
    //Call Share Button function
  }
});

请注意,如果您的按钮上有自定义事件,则使用.live绑定方法而不是普通的事件处理程序。 (.live处理动态内容)