ajax加载搜索结果

Question

我设置了一个搜索函数，它将在XSLT文件中进行搜索。这可以完美地工作，但我在使用ajax动态返回搜索结果时遇到了一些问题。

这是我的JS:

 var SearchHandler = function(frm) {
        frm = $(frm);
        var data = frm.find(".search-field").val();
        $.ajax({ 
            method: 'GET',
            url: '/',
            data: { query: data },
            dataType: 'xml',
            success: SearchSuccessHandler,
            error: SearchSuccessHandler
        });
    };
    var SearchSuccessHandler = function(html) {

    };

我想要的是SearchSuccessHandler从index.php动态加载搜索结果？query=搜索词

我似乎就是想不出正确的方法来处理它。

Answer 1

基于您的评论：

啊。。很抱歉ajax调用将返回一些基于查询我想替换我尝试过的现有html$('body').html(html.responseText);，但我无法再次搜索因为javascript没有正确加载

问题不是AJAX，而是事件委派

当您将函数直接绑定到元素时，如下所示：

$('.my-element').on('whatever', function() { ... })

只要元素存在，处理程序就会工作，但是如果替换整个主体的内容，您将遇到麻烦，因为原始.my-element不再存在。

您可以通过使用事件委派来确保您的功能保持搜索，例如来克服这一问题

$(body).on('whatever', '.my-element', function() { ... })

这基本上说："如果我点击body，目标是.my-element，那么执行这个函数。"而不是一个直接绑定的处理程序，它说："如果我点击这个特定元素上的，然后执行这个函数"

body将始终存在，因此您将始终能够从主体向下委托，但如果您可以在一些更具体的元素上进行委托，这显然会更好，从那时起，您将不会在整个主体上有onclick处理程序。

我认为这就是你的问题所在，因为你要替换整个身体。

Answer 2

试试这个

success:function(data) {
// do your stuff here
}

当然，您需要确保您的函数返回了一些值。为了让您的操作更容易，请在index.php 上将值编码为json

return json_encode($values)

然后，在成功函数中，只需使用eval（）