字符串到模式的直接链接被重复附加到URL

问题描述

我有一些代码，用户单击电子邮件图标，Outlook打开，它包含一个链接，可将他们重定向到特定的Bootstrap模式。

但是，如果用户单击重定向链接，然后再次进行电子邮件图标处理，则电子邮件中的URL如下所示：

https://website.com/page.aspx/#training-Modal/#training-Modal

它也会在以下页面上发生：

该链接将仍然正确地重定向用户，但是看起来很混乱。

如何防止重复添加模式的哈希值？我相信问题出在file.js中的$.each上，但是由于我正在使用它来显示每个训练项目，所以我想知道是否可以在index.js中进行编辑以防止发生循环。不知道e.preventDefault或类似的方法是否可以工作。

---

index.js：

// this function is working on the page,but in the email the long url is still happening
function revertToOriginalURL() {
    let original = window.location.href.substr(0,window.location.href.indexOf('/')) // #
    history.replaceState({},document.title,original);
}

$('.modal').on('hidden.bs.modal',function(e) {
    revertToOriginalURL(e);
});

$(document).ready(function() {
    if(window.location.href.indexOf('#training-Modal') != -1) {
        $('#training-Modal').modal('show');
    } else if(window.location.href.indexOf('#announcements-Modal') != -1){
        $('#announcements-Modal').modal('show');
    }
});

---

file.js：

       $.each(faqs,(idx,val) => {
         $("#training-content > ul").append(
                "<li data-topics='" +
                    val.Subcategory.results +
                    "'><a href='#faqItem" +
                    idx +
                    "' data-toggle='collapse'>" + 
                    val.Question + "&nbsp;&nbsp;" +
                    `<a href="mailto:?subject=Dept Training&body=Please review the Dept Training item pertaining to: ${val.Question}%0D%0A${deptUrl}/#training-Modal" target='_top'><i class='far fa-envelope'></i>` + "</a>" +
                    val.Answer +
                "</li>"
            )
         })

// the code for the #announcements-Modal looks almost exactly the same,except /#announcements-Modal is appended at the end of deptUrl

解决方法

更新：我做了一些过时的修复，但对我有用。简而言之，我在if / else中调用revertToOriginalURL();：

$(document).ready(function() {
    if(window.location.href.indexOf('#training-Modal') != -1) {
        $('#training-Modal').modal('show');
        revertToOriginalURL();
    } else if(window.location.href.indexOf('#announcements-Modal') != -1){
        $('#announcements-Modal').modal('show');
        revertToOriginalURL();
    } else {
        console.log('no modal on load')
    }
});

这可防止将模式窗口哈希重复添加到电子邮件正文中。