jquery - .load(url) 页面加载

Question

这是我的代码

<script type="text/javascript" language="javascript">
    $(document).ready(function (){
        $("#foo2").load("carousel/todos.html");
        $('#foo2').animate({ "opacity":"1" });
        $('#carouselselectitem1').css({ 'color' : '#FF0000', 'opacity' : '1' })
    });
</script>

animate()并且css()工作完美，但load()不导入我的 HTML。如果我使用click带有按钮的处理程序，它可以正常工作。

有人知道为什么吗？

Answer 1

为了保护您，浏览器不会自动加载页面（给出Origin null is not allowed by Access-Control-Allow-Origin错误）。您可以重新启动浏览器以允许此类活动或将其放在网络服务器上，它应该可以工作。

HTTP 访问控制

Answer 2

试试这个，可能是 foo 没有准备好加载，或者一些缓存问题

$(document).ready(function(){
 setTimeout(function(){
    $("#foo2").load("carousel/todos.html");
    $('#foo2').animate({ "opacity":"1" });
    $('#carouselselectitem1').css({ 'color' : '#FF0000', 'opacity' : '1' })
 },1000);


});

或试试这个

  $(document).ready(function(){

        $("#foo2").load("carousel/todos.html?"+ Math.random());
        $('#foo2').animate({ "opacity":"1" });
        $('#carouselselectitem1').css({ 'color' : '#FF0000', 'opacity' : '1' })

    });

Answer 3

试试这个：

<script type="text/javascript" language="javascript">
    $(document).ready(function (){
        $("#foo2").load("carousel/todos.html", function(){
          $(this).animate({ "opacity":"1" });
          $('#carouselselectitem1').css({ 'color' : '#FF0000', 'opacity' : '1' });
        });
    });
</script>

或者可能是这样：

<script type="text/javascript" language="javascript">
    $(document).ready(function () {
      $("#foo2").ready(function () {
        $(this) load("carousel/todos.html", function () {
          $(this).animate({"opacity": "1"});
          $('#carouselselectitem1').css({'color': '#FF0000', 'opacity': '1'});
        });
      });
    });
</script>