使用 javascript/jquery 触发 onchange 事件时更新 DOM 中的哈希值

Posted 2023-03-29

【中文标题】使用 javascript/jquery 触发 onchange 事件时更新 DOM 中的哈希值

【英文标题】：Update hash value in DOM when onchange event fired using javascript/jquery

【发布时间】：2019-04-22 22:48:43

【问题描述】：

我在两个选项卡式视图列表和网格中有内容。内容包括分页链接，其哈希值为#list 或#grid，具体取决于选项卡式视图。默认为#list。 When the tabbed view switches to grid I want to update the hash value on pagination links from #list to #grid on anchors with a class name of '.pagehash'.我如何使用 javascript/jquery 做到这一点？到目前为止，这是我所拥有的：

<a href="? query &cfilters=count&page= results.currentPage-1 #list" class="pagehash">&larr; Prev</a>

Javascript：

$('#view-tabs').on('change.zf.tabs', function() 
    $(".pagehash").attr('href').replace(/^.*?(#|$)/,location.hash); // doesn't work when tabs change from list -> grid
    console.log(location.hash); // works when tabs change fom list -> grid
);

我做错了什么？非常感谢任何帮助。搜索堆栈溢出和谷歌的答案。什么都没有出现。

【参考方案1】：

好吧，看来我自己已经回答了这个问题。在代码中添加了 cmets，但基本上我们得到的是不带 # 符号的当前原始哈希值，然后使用 .pagehash 类遍历每个分页链接实例，并在视图从列表切换时用新哈希替换当前哈希 ->网格或网格 -> 列表：

<script>
$('#view-tabs').on('change.zf.tabs', function() 
    // Get the raw hash value
    var getHash = location.hash.split('#')[1];
    // For EACH link that has a class of pagehash replace current hash value with hash symbol and raw hash value
    $('.pagehash').each(function() 
        var getLink = $(this).attr('href').replace(/\#.*/, '#'+getHash);
        $(this).attr('href', getLink);
    );
);
</script>