2

我最近创建了一个左侧有菜单栏的网站。我的下一步是根据您在菜单中选择的选项更新页面右侧的内容。我知道你可以使用 iframe，但我想知道是否有替代它的方法，比如更动态的！

大多数菜单选项都是输入表单，我读过关于 ajax-calls 来填充 div 但找不到关于如何实现它的好教程。

编辑：

这是一个草图http://imageshack.us/photo/my-images/16/smlithis.png/

4

4 回答 4

6

考虑使用 JQuery。处理 Ajax 请求比使用普通 JS 容易得多。ajax 函数的文档：http: //api.jquery.com/jQuery.ajax/

使用成功回调（成功时执行的函数），您可以填写您的 div：

$.ajax({
  url: 'ajax/test.html',
  success: function(data) {
    $('.result').html(data);
    alert('Load was performed.');
  }
});

而不是.result，将选择器指向您的主 div。.html() 函数用 填充您的 div data，这是从 ajax 请求返回的数据。

编辑：现在是 2018 年。使用Fetch API。

于 2012-11-27T12:18:33.420 回答
3

您可以使用 jQuery 您的菜单按钮如下所示： 

<a href='#' onclick='return fillDiv(1)'>GoTo1</a>  
<script>  
function fillDiv(pageNum){
  $("#id_of_div_to_load_to").load("some_page.php",{ 'pahe_num': pageNum } );  
return false;  
}
</script>

这只是众多方法中的一种。

于 2012-11-27T12:20:56.007 回答
0

你的意思是这样的： How to update div when on select change in jquery

如果您真的想从另一个来源动态获取数据，那将是完全不同的事情。

于 2012-11-27T12:18:02.780 回答
0

Ajax 可以从服务器获取数据，但它不能填充任何内容。Ajax 只是用于与服务器通信的 javascript。Javascript 可以获取该数据并插入数据并创建元素来填充该 div。

于 2012-11-27T12:14:50.493 回答