PHP/AJAX 生成 URL

Question

我有一个输入，用户可以输入一些东西，一个 ajax 请求通过 php 在数据库中获取这些结果，工作正常，然后每个结果，当点击时，都有一个关于它的更详细的页面，工作也很好，除了我希望它有一个独特的 url，我可以链接到某人而不是相同的。例如：我想要这个 'www.mysite.com/allItems.php?=detailedItem' 而目前它只是 www.mysite.com/allItems.php，即使我在详细页面中也是如此。我已经尝试过使用“a”标签但没有用。

var handleSearch = function(id, isStateBack) {
        var popID = typeof id != 'undefined' ? id : $(this).attr('id');

        if (!isStateBack) {
            window.history.pushState({popID: popID}, 'Search: ' + popID, 'work.php?=' + encodeURIComponent(popID));
        }
        $.get('AjaxSpecifics.php', {"details": popID}, function(data) {
            $('html').stop().html(data).hide().fadeIn(500);
        });
        return false;
    };
    $(document).on('click', '.imageSearchAjax', handleSearch);

    // popstate event
    window.addEventListener("popstate", function() {
        var currentState = history.state;
        if (typeof currentState.popID != 'undefined') {
            // this state has 'popID' property, handle it
            handleSearch(currentState.popID, true);
        }
    });

Answer 1

简单。只需在 PJAX 中迈出一步（Ajax + pushState）

您甚至可以使用 popstate 事件来处理浏览器的历史记录。

在此处适应您的代码：

var handleSearch = function(id, item, isStateBack) {
    var popID = typeof id != 'undefined' ? id : $(this).attr('id'),
        detailedItem = typeof item != 'undefined' ? item : 'your_current_detailed_item_here';
    // TODO: replace your_current_detailed_item_here with the proper thing
    if (!isStateBack) {
        window.history.pushState({popID: popID, detailedItem: detailedItem}, 'Search: ' + detailedItem, 'http://example.com/allItems.php?=' + encodeURIComponent(detailedItem));
    }
    $.get('AjaxSpecifics.php', {"details": popID}, function(data) {
        $('html').stop().html(data).hide().fadeIn(500);
    });
    return false;
};
$(document).on('click', '.imageSearchAjax', handleSearch);

// popstate event
window.addEventListener("popstate", function() {
    var currentState = history.state;
    if (typeof currentState.popID != 'undefined') {
        // this state has 'popID' property, handle it
        handleSearch(currentState.popID, currentState.detailedItem, true);
    }
});