iframe替换

时间:2013-04-06 21:43:57

标签: ajax iframe sidebar

我需要在左侧创建一个带侧边栏的页面,在右侧创建一个搜索页面。我需要能够执行搜索并显示结果而不刷新左侧聊天框中的内容。理想情况下,我需要这些页面能够相互通信,以便左侧框架的链接可以调用右侧的搜索。现在我正在使用PHP来处理右侧的搜索功能,但我可以使用任何语言。

我查看了iframe,但我真的希望将“搜索”页面作为主页面,以便浏览器中的滚动条反映搜索页面上的位置。

我也想过这可能是用AJAX完成的,但由于我的搜索框是一个表单,我不知道如何将参数传递给显示结果的页面。

希望这是有道理的,我会澄清我的能力。谢谢!

1 个答案:

答案 0 :(得分:1)

您仍然可以使用ajax。考虑jQuery

HTML搜索表单

<form id="searchForm">
 <input name="searchterm" />
 <input type="submit" value="Search" >
</form>

HTML搜索结果容器

<div id="searchResults"></div>

jQuery

$('#searchForm').on('submit', function(e) {
    var $form = $(this);
    e.preventDefault(); 
    $.ajax({
        url     : '/path/to/search.php',
        type    : 'post',
        data    : $form.serialize(),
        success : function (data) {
            $('#searchResults').html(data); // or parse out your data into HTML if it isnt already sent that way
        }
    });
});