无法在通过jQuery的ajax加载的页面中执行javascript

Not able to execute javascript inside page that's loaded via jQuery's ajax

本文关键字：执行 javascript 加载 ajax jQuery      更新时间：2023-09-26

摘要...

我有一个页面正在使用ajax加载其他页面，它们包含javascript。javascript 使用了document.ready，这在使用这样的代码时不起作用......

    $.ajax({
        type: 'get',
        url: 'layouts/' + layout + '.php',
        success: function(data){ 
            $('.swap').fadeOut('slow', function(){ // container
                $(this).delay(100).fadeIn().html(data);
            });
        }
    });

从某种意义上说，它不能正常工作，因为javascript运行得太快了。

加载使用document.ready或类似代码的页面的最佳方法是什么？

当你使用 ajax 加载一个页面时，该页面中的 javascript 通常不会被执行。 您可以使用 jQuerys load() 方法来加载页面，然后执行脚本。

在模板页面中，添加一个<div>来保存页面的实际内容，如下所示：

<div id="container">
  <ul>
    <li></li>
  </ul>
</div>

在"控制面板"页面中，还具有容器<div>：

<div id="container"></div>
<script src="bxslider.js"></script>

然后，您可以通过这种方式调用代码 

$(function(){
  var layout = 'layoutpage1';
  // this loads the contents of the #container div in layout page
  // into #container div on CP page.
  $('#container').load( '/layouts/' + layout + '.php #container', function() {
    initSlider();  // initialize the slider we just loaded
  });
  function initSlider() {
    $('.bxslider').bxSlider({
            pager: false,
            controls: false,
            auto: true,
            mode: 'fade',
            speed: 1500
    });
  }
  // if there is already a slider on the page we can initialize it here
  // just remove comment
  // initSlider();
});

您可以在 body 之前将所有脚本添加到主 html 文件中，并尝试在使用 ajax 调用的页面中启动它们的功能。

<div>
<ul class="slider">
    <li><img /></li>
    <li><img /></li>
</ul>
<script>
  $(document).ready(function(){
     //slider.init(); start slider 
  })
</script>

如果使用load()方法，脚本将执行。但是请注意，document.ready已经出现在主页中，因此脚本需要在它们引用的html之后。

或者，您可以在成功回调中使用$.getScript()

$('.swap').fadeOut(function(){
     $(this).load('layouts/' + layout + '.php', function(){
        $(this).fadeIn()
     });
})

我在这里发现了一些非常简单的东西，否则我就很简单了......

" $('.swap'(

.fadeOut('slow'， function(({">

您在 HTML 中没有标记为交换的类？

相关文章：