Question

我正在尝试使用jQuery库发出Ajax请求，但内容未加载。

我的main.js文件如下

$(function()
 {

//Loading static pages

         var loadSection=function(options)
         {  if (typeof options !== 'object')
              options= {};
            options.selector=options.selector || " ";
            options.url= options.url || " ";
            return  $.get(options.url, function(result)
                    {  $(options.selector).html(result)
                    },'html');
         }


  $('#Load').click(function()

  { $.when(
      loadSection({ selector: "#Section1", url: "Content1.html"}),
      loadSection({ selector: "#Section2", url: "Content2.html"}),
      loadSection({ selector: "#Section3", url: "Content3.html"})
  )
  .promise()
  .done(function()
    {
      $('#Proceed').removeAttr('disabled');
    })
    .fail(function(result)
    {  $("#Messages").append("Failure!<br />")
                     .append("Result: " + result.statusText + "<br />");
    });
 });
});

     /*  First way
     $('#Section1').load('Content1.html', function()
      {
       $('#Section2').load('Content2.html', function()
       {
        $('#Section3').load('Content3.html', function()
         {
          $('#Proceed').removeAttr('disabled');

           });
         });
      });
    */

index.html文件如下

<!doctype html>
  <html language="en">
    <head>
      <title>Deferred Proccessing 1</title>
      <link type="text/css" rel="stylesheet" href="DeferredStyles.css" />
      <script src="scripting/jquery-3.1.1.min.js"></script>
    </head>
  <body>
     <input id="Load" type="Button" value="Load" />
     <div id="Section1" ></div>
     <div id="Section2"></div>
     <div id="Section3"></div>
     <input id="Proceed" type="Button" value="Proceed" disabled="true" />
      <div id="Messages">
       </div>
  </body>
  <script src="scripting/main.js"></script>

 </html>

Content1.html如下

<div id="Content1">
 This is content #1
</div>

Content2.html和Content3.html也是如此。

我想弄明白为什么当我按下“加载”按钮时，未加载部分中的内容。此外，当我尝试在main.js中注释的第一种方式时，内容也未加载。我已经工作了两天，仍然不明白出了什么问题。我需要一些帮助

当我尝试在jQuery中执行Ajax调用请求时，不会加载内容

0 个答案: