简体   繁体   English

go 到页面并打开模态 javascript

[英]go to page and open modal javascript

The goal is to go to a page and show a modal from that page.目标是 go 到一个页面并从该页面显示一个模式。

Is there a way to have this execute after the page has successfully loaded?有没有办法在页面成功加载后执行?

//load page
window.location.href = 'foobar.html';

//wait until page is ready then open modal?
$(window).ready(function () {
  console.log('did it work?');
  $('#someModal').modal('show');
});

I listed the javascript file in the html page but this just isn't working.我在 html 页面中列出了 javascript 文件,但这不起作用。 Everything is happening in the same document window from the initial page.一切都发生在与初始页面相同的文档 window 中。

ANSWER回答

I decided to get the previous url and search for a substring to trigger the modal to show on the second page.我决定获取以前的 url 并搜索 substring 以触发模态显示在第二页上。

//first js script for the first html page
window.location.href = 'foobar.html';

//second js script for the second html page
$(document).ready(function () {

    var prev_url = document.referrer;

    if (prev_url.includes('substring')){
        $('#someModal').modal('show');
    }
});

Thank you for the suggestions.感谢您的建议。

I thought of a way to get this to work, On the second page document reload.我想了一种方法来让它工作,在第二页文档重新加载。 I will get the last url string and see if it contains a substring, If yes.我会得到最后一个 url 字符串,看看它是否包含 substring,如果是。 show the modal: Seems to be working :)显示模态:似乎正在工作:)

$(document).ready(function () {

    var prev_url = document.referrer;

    if (prev_url.includes('substring')){
        $('#someModal').modal('show');
    }
});

Unfortunately, javascript only exists in between page loads, every new page load will clear all executing javascript code.不幸的是,javascript 只存在于页面加载之间,每次新的页面加载都会清除所有正在执行的 javascript 代码。 If you want to simulate a page load, you can use the History api, which will push a new entry onto the browser's back button, and then run code after that.如果要模拟页面加载,可以使用 History api,它将新条目推送到浏览器的后退按钮上,然后运行代码。 instead of assigning values to window.location , you will need to call pushState and give it some arguments as described in the link, then proceed to call your modal code.而不是为window.location分配值,您需要调用pushState并按照链接中的说明给它一些 arguments ,然后继续调用您的模态代码。

for example,例如,

window.history.pushState({}, window.document.title, 'foobar.html');
$('#someModal').modal('show');

You should separate the scripts.您应该分开脚本。 1rst page:第一页:

 $(document).ready(function () {
window.location.href="foobar.html";
});

2nd page:第二页:

 $(document).ready(function () {
     $('#someModal').modal('show');
});

I hope this works for you.我希望这对你有用。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM