在另一个html页面上用另一个div替换一个div

时间:2011-07-20 15:09:20

标签: javascript jquery html

我有2个html页面

第1页和第2页的结构有点像这样

<div id="a">
  <div id="b">
  </div>
</div>

现在我要做的是点击事件我希望第1页的div b被第2页的div b替换

任何人都可以帮助我实现这个目标

4 个答案:

答案 0 :(得分:2)

您需要AJAX才能获得第2页的内容。然后,您可以使用replaceWith

答案 1 :(得分:2)

好吧,既然你没有给我任何工作,我会从头开始补充:

$('something').click(function(){
    $.post('page2.php',{}, function(data){
           $('#b').replaceWith($('#b', $(data)));
    })
})

答案 2 :(得分:2)

您正在寻找jQuery加载函数。

http://api.jquery.com/load/

$('#a').load('page2.html #b');

这将用第2页的#b替换#a中的所有内容。如果#a包含您想要保留的其他元素,则需要执行以下操作:

$.get('page2.html', {}, function(data) {
    $('#b').replaceWith($('#b', $(data)));
}) 

每当你想要替换#b元素时(即点击或随时),就运行它。

答案 3 :(得分:0)

  1. 在第1页上,将click事件绑定到特定函数
  2. 在您的特定功能中,您对服务器进行ajax调用
  3. 服务器为您提供您正在寻找的第2页的内容
  4. 仍然在第1页,然后您将从服务器收到的内容添加到您的页面
  5. 另一种可能性如下。 访问第1页时,您直接包含第2页的内容。但您隐藏了内容(css)。

    1. 您将点击绑定到特定功能
    2. 在此功能中,您只需获取第1页中的文字并显示
    3. 即可