Passing value to JS function through URL on window load

问题

my page http://www.dinomuhic.com/2010/index.php loads the Showreel at the start of the page using an onLoad call in body like this:

<body onLoad="sndReq('96')">

96 is the ID of the showreel in the SQL Library. The JS function "sndReq" is an AJAX call using JQuery which opens the requested item and displays it in the main window.

Now my question: What if I want to send a link to a client which opens a specific item directly so he does not have to navigate through the site?

Something like http://www.dinomuhic.com/2010/index.php?sndReq=234 (which of course doesn't work now and just opens the showreel, probably because the onLoad in the body tag overrides it)

How can I implement this? I want to be able to open specific items by URL but if nothing is passed through the URL it should always open item 96.

Thank you in advance. I'm sure its pretty easy I just can't see it.

Cletus

回答1:

You need to parse the query string. I find the easiest way to deal with the query string is to do the following. First, you need to extract the query string from the URL:

var queryStr = window.location.search; // will give you ?sndReq=234

Then, you can strip out the ? and split each query string parameter into an array:

var paramPairs = queryStr.substr(1).split('&');

Now you can build a hash table object of the name/value pairs making up the query string:

var params = {};
for (var i = 0; i < paramPairs.length; i++) {
    var parts = paramPairs[i].split('=');
    params[parts[0]] = parts[1];
}

In your onload, you can now use the parameter thusly:

sndReq(params.sndReq);

Make sure that the code is run within a script in the head of your document so that it's computed before the onload is executed.

回答2:

if you are using jQuery, why not use the DOM-ready handler instead of onload ? on that note, if it's just an ajax request, you don't even need to wait for DOM-ready. if you parse the query, you should be able to pass that in to your existing function.

// Wait for DOM-ready, may not be needed if you are just
// making a request, up to you to decide :)
$(function() {
    // window.location.search represents the query string for
    // current URL, including the leading '?', so strip it off.
    var query = window.location.search.replace(/^\?/, "");

    // If there is no query, default to '96'
    if ( !query ) {
        query = '96';
    }

    // Call existing function, passing the query value
    sndReq( query );
});

hope that helps! cheers.

回答3:

You can use RegExp to accomplish this, read the url parameters and pass them to ajax.

this simple script will read the current url and pass through regex to filter for paramters you specify.

EG: ThisReq = gip('sndReq'); pulls sndReq and value from the url.

<script language="javascript">
    function gip(name) {
        name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
        var regexS = "[\\?&]" + name + "=([^&#]*)";
        var regex = new RegExp(regexS);
        var results = regex.exec(window.location.href);
        if (results == null)
            sndReq('96');
         else
            return results[1];
    }
    // parameter pulled from url.
    ThisReq = gip('sndReq');
    // executes function sndReq();
    sndReq(''+ThisReq+'');
</script>

来源：https://stackoverflow.com/questions/7770887/passing-value-to-js-function-through-url-on-window-load

标签

javascript

url

variables

get

onload