javascript - 带分页的 Ajax 搜索功能

Question

我目前有一个使用 AJAX 提交的搜索表单。表格和结果效果很好，但是我遇到了分页问题。

分页是从搜索结果中拉进来的，所以当我点击链接时，我会被定向到没有样式的搜索结果页面。

我希望禁用分页的默认行为。我的代码如下：

function doTheSearch () {
         var options = {
            target: '#results',
            beforeSubmit:  showRequest
        };
        $('#filter').ajaxForm(options);
};

    function showRequest(formData, jqForm, options) {
        $('#results').prepend('<p class="searching">Searching database</p>');
        return true;
    }

    $(".pagination a").click(function(event) {
        event.preventDefault();
        doTheSearch();
    });

任何帮助表示赞赏。

非常感谢本

- - - - - - - 编辑 - - - - - - - -

下面的部分是显示当前结果的地方：

<section id="results">
   <!-- items are displayed here (using ExpressionEngine) -->
</section>

我还有一个执行搜索的搜索表单：

<form method="post" action="account/search-results" id="filter">

  <p>
     <label for="keywords">Enter number</label>
         <input type="text" name="keywords" id="keywords" value="" />
         <input type="submit" name="submit" id="submit" value="Search" />
  </p>

</form>

然后我有一个模板搜索结果，它将搜索结果拉到上面的 id="results" 中。

Answer 1

如果你描述一个<a>Tag 的 onclick 事件，你必须阻止默认返回。试试看

$(".pagination a").click(function(event) {
    event.preventDefault();
    doTheSearch();
    return false;
});