Question

我想实现一个基于AJAX的导航，当JS不可用时，它会优雅地退回，并希望在现有页面之上进行。为了实现这一目标，我将提供一个容器＆＃39; div：

标记了需要替换的页面部分
包含需要插入页面的所有脚本

我想要做的基本上是使用AJAX：

替换div #main
替换div
不要使用AJAX执行页面下载中包含的其他脚本

基本上是这样的：

<html>
   ... menu, navigation, borders, social etc...
   ... come scripts which must NOT be executed when using AJAX page load ...
   <div id="main">
      ... main HTML which needs to be replaced in page ...
      <script> ... scripts which need to be executed ... </script>
   </div>
   ... footer, copyright, links etc...
</html>

我从手册中知道以下内容不起作用：

$('#main a').click(function() {
    $('#main').load( $(this).attr('href')+' #main' );
})

因为CSS选择器会导致过滤掉所有脚本。所以我尝试使用$ .ajax并处理下面的代码。

$.ajax( $(this).attr('href') ).done( function(data) {
  $('#main').replaceWith( $(data).find('#main') );  // .1
  $(data).find('#main').filter("script").each(function() {
    eval( $(this).text() );   // .2
    alert( $(this).text() );  // .2
  });
 })

也不起作用。

.1将插入主DIV但不会插入任何SCRIPT
.2永远不会被执行

我最好的理解$（数据）不应该过滤掉脚本，但事实的试验表明这不起作用

到目前为止，我唯一的解决方案（或者我们应该称它为解决方法？）是使用基于正则表达式的数据解析＆＃39;字符串，但我不是那么喜欢，并希望有一个更强大和标准的解决方案。

P.S。：现有环境正在使用JQuery 1.7，但我相信我们可以轻松升级

P.P.S。：据我所知，上述内容仅适用于链接，不适用于表单，但这对我的用例来说已经足够了

通过AJAX导航并使用JQuery插入执行包含脚本的div

0 个答案: