0

目前我有这个代码用于将文件加载到 div 中。当我点击其中一个选项时，它只是链接到页面，而不是使用 AJAX 将页面加载到 div 中。

$(document).ready(function(){
  $('.eventSelect').click(function(){
    var url = 'includes/events.php';
    $('.content').load(url); 
  });
});   

$(document).ready(function(){
  $('.podSelect').click(function(){
    //Retrieve Content from the back-end PHP page, and pass the ID selected
    var url = 'includes/content.php';
    $('.content').load(url); 
  });
});

这是带有两个可单击选项的代码。因此，如果我单击 pod，则 pod 的内容将出现在 div 类（内容）中，并且对于事件也是如此。

echo "<div id=\"viewSelect\">";
echo "<div class=\"eventSelect\">";
echo "<a href=\"/../includes/events.php\">";
echo "events";
echo "</a>";
echo "</div>";
echo "<div class=\"podSelect\">";
echo "<a href=\"/../includes/events.php\">";
echo "pods";
echo "</a>";
echo "</div>";
echo "</div>";

我认为我的问题与href有关，但我不确定。

如果有人可以提供帮助，那就太好了，谢谢。

4

4 回答 4

1

我认为您需要从单击处理程序中返回 false 以防止默认行为。

于 2013-03-10T12:24:53.210 回答
1

只需将您的 JS 更改为以下 

 $(document).ready(function(){
      $('#viewSelect > a').click(function(){
        var url = $(this).attr('href');
        $('.content').load(url);
        return false; 
      });
    });

上面发生了什么
$(document).ready();<-- 确保代码在文档加载后运行

$('#viewSelect > a').click();<-- 将idanchor内的所有标签绑定到事件viewSelectclick

$(this).attr('href');<-- 获取 clckeked anchor href属性

return false; <-- 阻止默认功能（此处为超链接重定向）

一些建议

  • 您不需要重复相同的功能两次。这只能通过单个功能来实现。
  • 另外，我看不出您有任何理由HTML在php echo声明中包含明文。这只是服务器不必要的开销。
  • 正确阅读jQuery 文档，不要在 $(document).ready()每次编写新函数时启动。
于 2013-03-10T12:39:18.853 回答
0

你听说过 jquery bro 吗？...试试 jquery 这会解决你的问题。

function loadAjax(url,display)
{ $("."+display).html('Loading Content Please Wait...'); 
$.get(url,function(data){  $("."+display).html(data) }); }

现在参数是

 url=ajax feed to load (eg. includes/events.php)
    display = where to show your feed result. (eg. content)

像这样使用

<div class="content"></div> 
<a Onclick='loadAjax("includes/events.php","content")'>Click To Load Events</a>
<a Onclick='loadAjax("includes/contents.php","content")'>Click To Load Events</a>

显然，您需要 jquery 库才能使其工作。

于 2013-03-10T12:45:28.093 回答
0

试试去掉<a>标签

echo "<div id=\"viewSelect\">";
echo "<div class=\"eventSelect\">";
echo "events";
echo "</div>";
于 2013-03-10T12:21:58.850 回答