Bootstrap 重定向到表单并选择选项,仅在按钮单击时-否则默认为标准显示nav-tab

jgzswidk  于 2023-05-11  发布在  Bootstrap
关注(0)|答案(1)|浏览(89)

我在一个导航标签上有一个表单,我从另一个导航标签链接到它。我使用下面的代码从几个页面链接到我所有的导航标签。

const hash=window.location.hash;
        const bsTab = new bootstrap.Tab(hash);
        bsTab.show();

它工作,但是:
1.如果可能的话,我想在从URL重定向后删除标签。这是我的javascript的这一部分遇到的一个问题。
1.另一个是:为了使用按钮链接到我的表单,我想出了以下解决方案:

function redirectToForm() {
        window.location.href = "http://www.thedigitalguru.tech/#nav-contact-me-tab";
        localStorage.setItem("selectedOption", "2");
    }

    const hash=window.location.hash;
    const bsTab = new bootstrap.Tab(hash);
    bsTab.show();

    var selectedOption = localStorage.getItem("selectedOption");
    document.getElementById("reason").value = selectedOption;
    localStorage.removeItem("selectedOption");

乍一看,这是可行的,但是,如果我最终链接回表单,则不再选择默认选项。在一些情况下,不选择任何选项。我想总是有形式显示默认选择的选项(“0”默认情况下,这是禁用的,否则),除非我的按钮被点击。只有当我的按钮被点击时,我才想将这个值更改为选项2。如果我从另一个链接重定向到我的表单,我希望显示默认的禁用值
这是我的按钮:

<button id="gotoformselect2" onclick="redirectToForm()">Request References</button>

也许对JavaScript稍有了解的人可以:
1.帮助我删除重定向到每个导航标签后的散列&
1.可以更好地构造我的代码,以便在单击按钮时只选择选项2。
否则,如果我链接到表单或任何其他导航选项卡,我只想使用以下代码:

const hash=window.location.hash;
        const bsTab = new bootstrap.Tab(hash);
        bsTab.show();

让我知道如果你能帮助!先谢谢你了。

bwleehnv

bwleehnv1#

这将帮助您:

function redirectToForm() {
    window.location.href = "http://www.thedigitalguru.tech/#nav-contact-me-tab";
    localStorage.setItem("selectedOption", "2");
}
if(location.hash){
  const hash= location.hash;
  const bsTab = new bootstrap.Tab(hash);
  bsTab.show();
  history.replaceState('',null,location.origin);//replaces the hash
}
if(localStorage.getItem('selectedOption')){
       const option = localStorage.getItem('selectedOption');
       document.getElementById('reason').selectedIndex= option;
       localStorage.removeItem("selectedOption");
 }

1.使用history API替换hash。
1.使用selectedIndex选择下拉选项。

相关问题