Use JavaScript to go to a page and automatically do a function on that page

Question

Hopefully this is a no-brainer for all you experts, but I can't find the answer. I want to click on an element on Page A that will take me to Page B and automatically perform a function (here it's called showGrp) defined on Page B. On Page A, I want to click something like this (obviously, it doesn't work, but I think it conveys the idea):

<span onclick="location.assign('http://happy.com/pageB.htm').('showGrp(); return false;')">
    <h2>Search Topics</h2>
</span>`

There's no way to affect the newly loaded page from the old page. If you can control pageB, you could add a search string to the URL, and then check it in that new page. Notice also, that `h2` within [`span`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span) is invalid HTML. — Teemu, Aug 28 '14 at 14:42
I'm not entirely sure what you're proposing is actually possible. — RevanProdigalKnight, Aug 28 '14 at 14:43
Thanks, everyone! Unfortunately, I don't control Page B. Then it would be easy to just pass a URL value. — octopusCrime, Aug 28 '14 at 15:02
If you can't control pageB, then no, there's no way to do that. — yuvi, Aug 28 '14 at 21:16
Another shot in the dark before I cry "uncle". What if I load Page B into an iframe? — octopusCrime, Aug 29 '14 at 15:27
I'm afraid you've start to cry ; ), if Page B is in an [other domain](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Same_origin_policy_for_JavaScript), and you can't control it, there's nothing you can do to achieve this. — Teemu, Aug 29 '14 at 18:50

score 2 · Answer 1 · edited May 23 '17 at 11:57

Short answer: there's no way to do that. You can't tell a new page to run a function through an old page

Long answer: You can, however, set up page B so it will know that if the request URL contains a certain argument in its GET data, it will run showGrp. i.e.:

going to http://happy.com/pageB.htm will do nothing
going to http://happy.com/pageB.htm?showGrp=1 will run function

You can use this function like so:

// put this wherever you want to run this - most probably when the page is loaded
if (getParameterByName('showGrp')) {
    showGrp();
}

score 1 · Answer 2 · answered Aug 28 '14 at 15:01

You could do something like this:

PageA:

<html>
    <body>
        <a href="pageB.html?f=showGrp">
            <h2>Search Topics</h2>
        </a>
    </body>
</html>

PageB:

<html>
    <head>
        <script type="text/javascript">
            function getQueryVariable(variable) {
                var query = window.location.search.substring(1);
                var vars = query.split('&');
                for (var i = 0; i < vars.length; i++) {
                    var pair = vars[i].split('=');
                    if (decodeURIComponent(pair[0]) == variable) {
                        return decodeURIComponent(pair[1]);
                    }
                }
            }

            var init = {
                    showGrp: function () {
                        console.log("Hello world!");
                    },
                    otherFunc: function() {
                        console.log("Lalala!");
                    }
                };

            init[getQueryVariable("f")]();
        </script>
    </head>
</html>

By making this you are able to execute whatever function you want just passing it name as an argument to the pageB's URL.

score 0 · Answer 3 · answered Aug 28 '14 at 14:47

0

I would just put the code that you want to run in the window onload function on page B. I think that will do what you want.

window.onload = function() {
    showGrp();
};

See a description of onload at the Mozilla Developers Network.

answered Aug 28 '14 at 14:47

ArtfulDodger

69
2

score 0 · Answer 4 · answered Aug 28 '14 at 14:47

Page A should look like:

<div id = "yourclickobject" onclick="pageB.html"> Some random text </div>

Page B:

<head>
<script>
var myFunction = function(){

    alert("hello world");
}

myFunction();
</script>
</head>

Does this help? As soon as you go on page B myFunction is called. All you need to do is put it in the head

Use JavaScript to go to a page and automatically do a function on that page

4 Answers4