如何使用 javascript (Jquery) 检索查询字符串参数和值?

发布于 2024-07-27 20:54:36 字数 383 浏览 5 评论 0原文

点击我,

$('.clickme').click(function(event) {
event.preventDefault();
var stringId = $(this).attr("id");
    var mId = stringId.substring(2)
....

我可以使用锚元素的 ID 检索 id 的值。 我想我应该能够直接从 href 获取它。 那么如何从 HREF(url 查询字符串)中检索 id 和 status 的值?

我正在使用 Jquery。

感谢您的帮助。

更新: 另外,我如何获取所有 URL 值..即“test.php?id=100&blah=blah”?

Click me

$('.clickme').click(function(event) {
event.preventDefault();
var stringId = $(this).attr("id");
    var mId = stringId.substring(2)
....

I can retrieve the value of id using ID of anchor element. I think I should be able to get it directly from href. So how do I retrieve value of id and status from HREF (url query string)?

I am using Jquery.

Thank you for your help.

UPDATE:
Also how do I can get all of the URL value .. i.e. "test.php?id=100&blah=blah"?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(6

和我恋爱吧 2024-08-03 20:54:36

此代码:

function querySt(ji) {
    hu = $(".clickme").attr("href");
    gy = hu.split("&");
    for (i=0;i<gy.length;i++) {
        ft = gy[i].split("=");
        if (ft[0] == ji) {
            return ft[1];
        }
    }
}

要使用它:

document.write(querySt("id"));
document.write(querySt("status"));

回答您的“更新”:

http: //ilovethecode.com/Javascript/Javascript-Tutorials-How_To-Easy/Get_Query_String_Using_Javascript.shtml

This code:

function querySt(ji) {
    hu = $(".clickme").attr("href");
    gy = hu.split("&");
    for (i=0;i<gy.length;i++) {
        ft = gy[i].split("=");
        if (ft[0] == ji) {
            return ft[1];
        }
    }
}

To use it:

document.write(querySt("id"));
document.write(querySt("status"));

Answer to your 'update':

http://ilovethecode.com/Javascript/Javascript-Tutorials-How_To-Easy/Get_Query_String_Using_Javascript.shtml

白昼 2024-08-03 20:54:36
var stringId = $(this).attr("id"); // this will return p_100
var stringId = $(this).attr("id").split('_')[1]; // this will return 100

var attr= $(this).attr("href"); // this will return all href attribute value

更新

//href="test.php?id=100&status=pending&time=2009"
var attrFromAnchor= $(this).attr("href").split('?')[1].split('&')[0].split('=')[1]; // returns 100
var stringId = $(this).attr("id"); // this will return p_100
var stringId = $(this).attr("id").split('_')[1]; // this will return 100

var attr= $(this).attr("href"); // this will return all href attribute value

UPDATE

//href="test.php?id=100&status=pending&time=2009"
var attrFromAnchor= $(this).attr("href").split('?')[1].split('&')[0].split('=')[1]; // returns 100
缱倦旧时光 2024-08-03 20:54:36

这里有很多好的解决方案,但我想我应该发布自己的解决方案。
这是我组合在一起的一个快速小函数,它将解析来自 window.location.search 或提供的搜索字符串值的格式的查询字符串;

它返回 id 值对的哈希值,因此您可以以以下形式引用它:

var values = getQueryParams();
values['id']
values['blah']

这是代码:

/*
 This function assumes that the query string provided will
 contain a ? character before the query string itself.
 It will not work if the ? is not present.

 In addition, sites which don't use ? to delimit the start of the query string
 (ie. Google) won't work properly with this script.
 */
function getQueryParams( val ) {
    //Use the window.location.search if we don't have a val.
    var query = val || window.location.search;
    query = query.split('?')[1]
    var pairs = query.split('&');
    var retval = {};
    var check = [];
    for( var i = 0; i < pairs.length; i++ ) {
        check = pairs[i].split('=');
        retval[decodeURIComponent(check[0])] = decodeURIComponent(check[1]);
    }

    return retval;
}

要从 URL 获取查询字符串的值而不进行字符串解析,您可以执行以下操作:

window.location.search.substr(1)

如果您希望在? 您仍然需要进行一些字符串解析:

var path = window.location.pathname.replace(/^.*\/(.*)$/,'$1');
var query = path + window.location.search;
//If your URL is http://www.myserver.com/some/long/path/big_long%20file.php?some=file&equals=me
//you will get: big_long%20file.php?some=file&equals=me

希望这会有所帮助!
干杯。

There are a lot of good solutions here but I figured I'd post my own.
Here's a quick little function I threw together which will parse a query string in the format from either window.location.search or from a provided search string value;

It returns a hash of id value pairs so you could reference it in the form of:

var values = getQueryParams();
values['id']
values['blah']

Here's the code:

/*
 This function assumes that the query string provided will
 contain a ? character before the query string itself.
 It will not work if the ? is not present.

 In addition, sites which don't use ? to delimit the start of the query string
 (ie. Google) won't work properly with this script.
 */
function getQueryParams( val ) {
    //Use the window.location.search if we don't have a val.
    var query = val || window.location.search;
    query = query.split('?')[1]
    var pairs = query.split('&');
    var retval = {};
    var check = [];
    for( var i = 0; i < pairs.length; i++ ) {
        check = pairs[i].split('=');
        retval[decodeURIComponent(check[0])] = decodeURIComponent(check[1]);
    }

    return retval;
}

To get the value of the query string from the URL without string parsing you can do:

window.location.search.substr(1)

If you want the name of the page before the ? you still need to do a little string parsing:

var path = window.location.pathname.replace(/^.*\/(.*)$/,'$1');
var query = path + window.location.search;
//If your URL is http://www.myserver.com/some/long/path/big_long%20file.php?some=file&equals=me
//you will get: big_long%20file.php?some=file&equals=me

Hope this helps!
Cheers.

寄与心 2024-08-03 20:54:36

这是一个简洁(但完整)的实现,用于从查询字符串中获取所有名称/值对:

function getQueryParams(qs) {
    qs = qs.split("+").join(" ");
    var params = {};
    var tokens;

    while (tokens = /[?&]?([^=]+)=([^&]*)/g.exec(qs)) {
        params[decodeURIComponent(tokens[1])]
            = decodeURIComponent(tokens[2]);
    }

    return params;
}

//var query = getQueryParams(document.location.search);
//alert(query.foo);

Here's a concise (yet complete) implementation for getting ALL name/value pairs from a query string:

function getQueryParams(qs) {
    qs = qs.split("+").join(" ");
    var params = {};
    var tokens;

    while (tokens = /[?&]?([^=]+)=([^&]*)/g.exec(qs)) {
        params[decodeURIComponent(tokens[1])]
            = decodeURIComponent(tokens[2]);
    }

    return params;
}

//var query = getQueryParams(document.location.search);
//alert(query.foo);
凡尘雨 2024-08-03 20:54:36

不需要 jQuery,该解决方案适用于所有浏览器:

function querySt(ji)
{
    hu = window.location.search.substring(1);
    gy = hu.split("&");
    for (i=0;i<gy.length;i++) {
    ft = gy[i].split("=");
    if (ft[0] == ji) {
    return ft[1];
    }
    }
    return "";
}

No need for jQuery, this solution works on all browsers:

function querySt(ji)
{
    hu = window.location.search.substring(1);
    gy = hu.split("&");
    for (i=0;i<gy.length;i++) {
    ft = gy[i].split("=");
    if (ft[0] == ji) {
    return ft[1];
    }
    }
    return "";
}
流年已逝 2024-08-03 20:54:36

这里的答案现在已经过时了

使用 Vanilla JavaScript (ES5) 查看此解决方案

var qd = {}; // qd stands for query dict
document.getElementById("p_100")[0].href.split("?")[1].split("&").forEach(function(item) {var k = item.split("=")[0], v = decodeURIComponent(item.split("=")[1]); (k in qd) ? qd[k].push(v) : qd[k] = [v,]})

我喜欢假装它是 oneliner,但有人告诉我事实并非如此。 嗯...无论如何,谁会在新行上拆分链式函数调用,对吗?

示例:

"test.php?id=100&status=pending&time=2009"
> qd
id: ["100"]
status: ["pending"]
time: ["2009"]

// values can also be obtained like this
> qd.id[0]    // "100"
> qd["id"][0] // "100"

*它返回数组,因为它针对多值键进行了优化 。 请在此处查找虚拟解决方案(不含数组)。

注意:要向旧浏览器传授新的.forEach,您可以注入此 polyfill 来自 Mozilla (MDN)。

Answers here are outdated now.

See this solution using Vanilla JavaScript (ES5)

var qd = {}; // qd stands for query dict
document.getElementById("p_100")[0].href.split("?")[1].split("&").forEach(function(item) {var k = item.split("=")[0], v = decodeURIComponent(item.split("=")[1]); (k in qd) ? qd[k].push(v) : qd[k] = [v,]})

I like to pretend it's oneliner, but I was told it's not. hmm...Who would split chained function calls on new lines anyways, right?

example:

"test.php?id=100&status=pending&time=2009"
> qd
id: ["100"]
status: ["pending"]
time: ["2009"]

// values can also be obtained like this
> qd.id[0]    // "100"
> qd["id"][0] // "100"

*It returns arrays, because it is optimized for multi-valued keys. Look here for dummy solutions (without arrays).

note: To teach old browsers the new .forEach you can inject this polyfill from Mozilla (MDN).

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文