Question

请参阅http://www.elitedeafpoker.com/dev/poker-players.html - 我试图使用AJAX / jQuery在此页面上加载三个内容，它不会加载内容（最终，我想使用JSON调用加载每个内容），但首先我想要在我深入使用JSON之前看看这是否有效。请告诉我如果这不是使用AJAX / jQuery加载内容的最佳方式 - 请欣赏它。

HTML

<article class="span3">
  <ul class="list-1">
    <li class="navlinks" id="pokerplayers"><a href="#pokerplayers">EDPS Poker Players </a></li>
    <li class="navlinks" id="playerofthemonth"><a href="#playerofthemonth">Players of the Month</a></li>
    <li class="navlinks" id="playeroftheyear"><a href="#playeroftheyear">Players of the Year </a></li>
 </ul>
</article>
<article class="span9">
 <div id="content">
    Contents to load...
 </div>
</article>

Javascript（content.js）

$(document).ready(function(){
$("#pokerplayers").click(function(e){
var page = $(this).attr('href, word: hash');
e.preventDefault(); 
$("#content").load("content.html #pokerplayers");
$(this).hide().fadeIn("slow");
});
$("#playerofthemonth").click(function(e){ 
var page = $(this).attr('href, word: hash');
e.preventDefault(); 
$("#content").load("content.html #playerofthemonth");
$(this).hide().fadeIn("slow");
});
$("#playeroftheyear").click(function(e){
var page = $(this).attr('href, word: hash'); 
e.preventDefault(); 
$("#content").load("content.html #playeroftheyear");
$(this).hide().fadeIn("slow");
});
});

content.html

<div id="pokerplayers">
   <p class="content-text">Poker Players</p>
</div>
<div id="playerofthemonth">
   <p class="content-text">Player of the Month</p>
</div>
<div id="playeroftheyear">
   <p class="content-text">Player of the Year</p>
</div>

Answer 1

它适用于我，是通过打开文件还是使用服务器来运行它？它运行时不起作用：

file:///C:/Users/xxx/Desktop/stackoverflow/index.html

但是当我将它上传到我的服务器时它工作得很好，看看here

使用AJAX / jQuery加载内容

1 个答案: