頁面重新加載后單擊按鈕

Question

我在頁面上有一些鏈接，當用戶單擊鏈接時，頁面會重新加載。

所有鏈接都有一些ID，並且所有鏈接都有一個相同的類。

重新加載頁面后，我需要單擊其他鏈接，但前提是用戶單擊具有特定類的某些鏈接（而不是任何地方，如菜單鏈接）。

我如何使用JS或jQuery做類似的事情？

Answer 1

聽起來您正在嘗試構建單個頁面應用程序，即該應用程序主要由JavaScript運行而不是服務器端渲染。 在這種情況下，頁面重裝是您的敵人。 頁面重新加載基本上是頁面的重新啟動，盡管您可以使用cookie或localStorage保持狀態，但這將為您提供較差的用戶體驗。

在這種情況下，您只需將事件處理程序添加到用戶將要執行的任何操作中，並且只需使用javascript處理它們即可，而無需從服務器重新加載頁面。 如果您需要獲取更多數據來響應用戶的操作，則可以使用AJAX從服務器中提取該數據。

如果您必須使用帶有URL的鏈接（我仍然不清楚為什么這是必要的），我建議您使用哈希URL，例如'#some-action' ，單擊該鏈接將不會重新加載頁面。 然后，您可以將事件處理程序附加到鏈接，甚至可以使用hashchange事件來監聽要更改的url哈希。 這樣，您可以知道用戶按下了什么鏈接。

如果不嘗試構建單個頁面應用程序，則需要在服務器上添加代碼以在頁面中存儲所需的信息。

Answer 2

我做的。

因此，我創建了函數：

/**
 * Click on delivery link after page reload
 *
 * @return {boolean} [loacalStorage is available]
 */
$.fn.openDelivery = function(){
    if (localStorage) {
        var addedToCart = localStorage["addCart"];
        if (addedToCart) {
            setTimeout(function() {
                $('#showRight').trigger('click');
            }, 1500);
            localStorage.removeItem("addCart");
        }
        $(this).click(function(e) {
            localStorage["addCart"] = true;
        });

        return true;
    }

    return false;
};

然后調用該函數：

$(document).ready(function () {
    // Trigger delivery click
    $('.class-of-my-link').openDelivery();
});

在我的情況下，頁面會在用戶在購物車中添加一些商品后重新加載。 使用此功能，我單擊鏈接（具有1.5秒的延遲），該鏈接將打開屏幕右側顯示的用戶的購物車。