มีไลบรารี JavaScript ใดที่ทำให้พจนานุกรมออกจากสตริงการสืบค้นASP.NETสไตล์หรือไม่

สิ่งที่สามารถใช้ได้เช่น:

var query = window.location.querystring["query"]?

เป็น"สตริงแบบสอบถาม"เรียกว่าอย่างอื่นนอก.NETดินแดน? ทำไมไม่location.searchเสียเป็นคอลเลกชันคีย์ / ค่า ?

แก้ไข : ฉันเขียนฟังก์ชันของตัวเอง แต่ไลบรารี JavaScript หลัก ๆ ทำสิ่งนี้หรือไม่

อาจจะhttp://plugins.jquery.com/query-object/ ?

นี่คือส้อมของมันhttps://github.com/sousk/jquery.parsequery#readme

คุณสามารถแยกคู่คีย์ / ค่าจากคุณสมบัติlocation.searchคุณสมบัตินี้มีส่วนของ URL ที่ตามหลัง? สัญลักษณ์รวมถึง? สัญลักษณ์.

function getQueryString() {
  var result = {}, queryString = location.search.slice(1),
      re = /([^&=]+)=([^&]*)/g, m;

  while (m = re.exec(queryString)) {
    result[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
  }

  return result;
}

// ...
var myParam = getQueryString()["myParam"];

tl; drบนโค้ดบรรทัดเดียว (ish) โดยใช้ vanilla javascript

var queryDict = {}
location.search.substr(1).split("&").forEach(function(item) {
    queryDict[item.split("=")[0]] = item.split("=")[1]
})

สำหรับ querystring ?a=1&b=2&c=3&d&eจะส่งกลับ:

> queryDict
a: "1"
b: "2"
c: "3"
d: undefined
e: undefined

คีย์หลายค่าและอักขระที่เข้ารหัส ?

ดูคำตอบเดิมได้ที่How can get query string values ​​in JavaScript?

"?a=1&b=2&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab"
> queryDict
a: ["1", "5", "t e x t"]
b: ["2"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]

หลังจากพบโพสต์นี้เมื่อมองหาตัวเองฉันคิดว่าฉันควรเพิ่มว่าฉันไม่คิดว่าโซลูชันที่ได้รับการโหวตมากที่สุดจะดีที่สุด มันไม่จัดการค่าอาร์เรย์ (เช่น? a = foo & a = bar - ในกรณีนี้ฉันคาดว่าจะได้รับผลตอบแทน ['foo', 'bar']) เท่าที่ฉันสามารถบอกได้ว่าไม่ได้คำนึงถึงค่าที่เข้ารหัสเช่นการเข้ารหัสอักขระเลขฐานสิบหกโดยที่% 20 แสดงถึงช่องว่าง (ตัวอย่าง:? a = Hello% 20World) หรือสัญลักษณ์บวกที่ใช้แทนช่องว่าง (ตัวอย่างเช่น :? a = Hello + World)

Node.js นำเสนอสิ่งที่ดูเหมือนโซลูชันที่สมบูรณ์มากสำหรับการแยกวิเคราะห์สตริงการสืบค้น มันจะเป็นเรื่องง่ายที่จะนำออกและใช้ในโครงการของคุณเองเนื่องจากแยกได้ค่อนข้างดีและอยู่ภายใต้ใบอนุญาตที่อนุญาต

สามารถดูรหัสได้ที่นี่: https://github.com/joyent/node/blob/master/lib/querystring.js

การทดสอบที่ Node สามารถดูได้ที่นี่: https://github.com/joyent/node/blob/master/test/simple/test-querystring.jsฉันขอแนะนำให้ลองใช้สิ่งเหล่านี้พร้อมคำตอบยอดนิยมเพื่อดูว่ามันเป็นอย่างไร จัดการพวกเขา

นอกจากนี้ยังมีโครงการที่ฉันมีส่วนร่วมเพื่อเพิ่มฟังก์ชันนี้โดยเฉพาะ เป็นพอร์ตของโมดูลการแยกวิเคราะห์สตริงเคียวรี lib มาตรฐาน Python ส้อมของฉันอยู่ที่นี่: https://github.com/d0ugal/jquery.qeeree

หรือคุณอาจจะใช้ห้องสมุดsugar.js

จาก sugarjs.com:

Object.fromQueryString (strลึก = จริง)

แปลงสตริงการสืบค้นของ URL เป็นออบเจ็กต์ หากลึกเป็นเท็จการแปลงจะยอมรับเฉพาะพารามิเตอร์แบบตื้น (เช่นไม่มีอ็อบเจ็กต์หรืออาร์เรย์ที่มี [] วากยสัมพันธ์) เนื่องจากสิ่งเหล่านี้ไม่ได้รับการสนับสนุนในระดับสากล

Object.fromQueryString('foo=bar&broken=wear') >{"foo":"bar","broken":"wear"}
Object.fromQueryString('foo[]=1&foo[]=2') >{"foo":[1,2]}

ตัวอย่าง:

var queryString = Object.fromQueryString(location.search);
var foo = queryString.foo;

หากคุณมีแบบสอบถามอยู่ในมือให้ใช้สิ่งนี้:

 /**
 * @param qry the querystring
 * @param name name of parameter
 * @returns the parameter specified by name
 * @author eduardo.medeirospereira@gmail.com
 */

function getQueryStringParameter(qry,name){
    if(typeof qry !== undefined && qry !== ""){
        var keyValueArray = qry.split("&");
        for ( var i = 0; i < keyValueArray.length; i++) {
            if(keyValueArray[i].indexOf(name)>-1){
                return keyValueArray[i].split("=")[1];
            }
        }
    }
    return "";
}

// How about this
function queryString(qs) {
    var queryStr = qs.substr(1).split("&"),obj={};
    for(var i=0; i < queryStr.length;i++)
        obj[queryStr[i].split("=")[0]] = queryStr[i].split("=")[1];
    return obj;
}

// Usage:
var result = queryString(location.search);

เป็นที่น่าสังเกตว่าไลบรารีที่ John Slegers กล่าวถึงนั้นมีการพึ่งพา jQuery แต่นี่เป็นเวอร์ชันที่เป็น Javascript วานิลลา

https://github.com/EldonMcGuinness/querystring.js

ฉันจะแสดงความคิดเห็นในโพสต์ของเขา แต่ฉันไม่มีชื่อเสียงในการทำเช่นนั้น : /

ตัวอย่าง:

ตัวอย่างด้านล่างประมวลผลสิ่งต่อไปนี้แม้ว่าสตริงข้อความค้นหาจะไม่สม่ำเสมอ:

?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab 

var qs = "?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab";
//var qs = "?=&=";
//var qs = ""

var results = querystring(qs);

(document.getElementById("results")).innerHTML =JSON.stringify(results, null, 2);

<script 
src="https://rawgit.com/EldonMcGuinness/querystring.js/master/dist/querystring.min.js"></script>
<pre id="results">RESULTS: Waiting...</pre>

รหัส

Gist โดย Eldon McGuinnessนี้เป็นการใช้งานตัวแยกวิเคราะห์สตริงการสืบค้น JavaScript ที่สมบูรณ์แบบที่สุดเท่าที่ฉันเคยเห็นมา

น่าเสียดายที่มันเขียนเป็นปลั๊กอิน jQuery

ฉันเขียนใหม่เป็น vanilla JS และทำการปรับปรุงเล็กน้อย:

function parseQuery(str) {
  var qso = {};
  var qs = (str || document.location.search);
  // Check for an empty querystring
  if (qs == "") {
    return qso;
  }
  // Normalize the querystring
  qs = qs.replace(/(^\?)/, '').replace(/;/g, '&');
  while (qs.indexOf("&&") != -1) {
    qs = qs.replace(/&&/g, '&');
  }
  qs = qs.replace(/([\&]+$)/, '');
  // Break the querystring into parts
  qs = qs.split("&");
  // Build the querystring object
  for (var i = 0; i < qs.length; i++) {
    var qi = qs[i].split("=");
    qi = qi.map(function(n) {
      return decodeURIComponent(n)
    });
    if (typeof qi[1] === "undefined") {
      qi[1] = null;
    }
    if (typeof qso[qi[0]] !== "undefined") {

      // If a key already exists then make this an object
      if (typeof (qso[qi[0]]) == "string") {
        var temp = qso[qi[0]];
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]] = [];
        qso[qi[0]].push(temp);
        qso[qi[0]].push(qi[1]);

      } else if (typeof (qso[qi[0]]) == "object") {
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]].push(qi[1]);
      }
    } else {
      // If no key exists just set it as a string
      if (qi[1] == "") {
        qi[1] = null;
      }
      qso[qi[0]] = qi[1];
    }
  }
  return qso;
}

วิธีการใช้งาน

var results = parseQuery("?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab");

เอาต์พุต

{
  "foo": ["bar", "boo" ],
  "roo": "bar",
  "bee": "bop",
  "": ["ghost", "ghost2"],
  "checkbox[]": ["b1", "b2"],
  "dd": null,
  "http": [
    "http://w3schools.com/my test.asp?name=ståle&car=saab",
    "http://w3schools2.com/my test.asp?name=ståle&car=saab"
  ]
}

ดูFiddle นี้ด้วย

function decode(s) {
    try {
        return decodeURIComponent(s).replace(/\r\n|\r|\n/g, "\r\n");
    } catch (e) {
        return "";
    }
}
function getQueryString(win) {
    var qs = win.location.search;
    var multimap = {};
    if (qs.length > 1) {
        qs = qs.substr(1);
        qs.replace(/([^=&]+)=([^&]*)/g, function(match, hfname, hfvalue) {
            var name = decode(hfname);
            var value = decode(hfvalue);
            if (name.length > 0) {
                if (!multimap.hasOwnProperty(name)) {
                    multimap[name] = [];
                }
                multimap[name].push(value);
            }
        });
    }
    return multimap;
}
var keys = getQueryString(window);
for (var i in keys) {
    if (keys.hasOwnProperty(i)) {
        for (var z = 0; z < keys[i].length; ++z) {
            alert(i + ":" + keys[i][z]);
        }
    }
}

ฉันชอบให้มันเรียบง่ายอ่านง่ายและมีขนาดเล็ก

function searchToObject(search) {
    var pairs = search.substring(1).split("&"),
        obj = {}, pair;

    for (var i in pairs) {
        if (pairs[i] === "") continue;
        pair = pairs[i].split("=");
        obj[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
    }
    return obj;
}

searchToObject(location.search);

ตัวอย่าง:

searchToObject('?query=myvalue')['query']; // spits out: 'myvalue'

ฟังก์ชั่นที่ฉันเขียนสำหรับความต้องการที่คล้ายกับสิ่งนี้ด้วยการจัดการสตริงจาวาสคริปต์ล้วนๆ

"http://www.google.lk/?Name=John&Age=20&Gender=Male"

function queryize(sampleurl){
    var tokens = url.split('?')[1].split('&');
    var result = {};

    for(var i=0; i<tokens.length; i++){
        result[tokens[i].split('=')[0]] = tokens[i].split('=')[1];
    }

    return result;
}

การใช้งาน:

queryize(window.location.href)['Name'] //returns John
queryize(window.location.href)['Age'] //returns 20
queryize(window.location.href)['Gender'] //returns Male

หากคุณใช้ lodash + ES6 นี่คือวิธีแก้ปัญหาแบบบรรทัดเดียว: _.object(window.location.search.replace(/(^\?)/, '').split('&').map(keyVal => keyVal.split('=')));

เอาล่ะเนื่องจากทุกคนไม่สนใจคำถามที่แท้จริงของฉันเดี๋ยวก่อนฉันจะโพสต์ของฉันด้วย! นี่คือสิ่งที่ฉันมี:

location.querystring = (function() {

    // The return is a collection of key/value pairs

    var queryStringDictionary = {};

    // Gets the query string, starts with '?'

    var querystring = unescape(location.search);

    // document.location.search is empty if no query string

    if (!querystring) {
        return {};
    }

    // Remove the '?' via substring(1)

    querystring = querystring.substring(1);

    // '&' seperates key/value pairs

    var pairs = querystring.split("&");

    // Load the key/values of the return collection

    for (var i = 0; i < pairs.length; i++) {
        var keyValuePair = pairs[i].split("=");
        queryStringDictionary[keyValuePair[0]] = keyValuePair[1];
    }

    // Return the key/value pairs concatenated

    queryStringDictionary.toString = function() {

        if (queryStringDictionary.length == 0) {
            return "";
        }

        var toString = "?";

        for (var key in queryStringDictionary) {
            toString += key + "=" + queryStringDictionary[key];
        }

        return toString;
    };

    // Return the key/value dictionary

    return queryStringDictionary;
})();

และการทดสอบ:

alert(window.location.querystring.toString());

for (var key in location.querystring) {
    alert(key + "=" + location.querystring[key]);
}

คุณคิดว่า JavaScript ไม่ใช่ภาษาแม่ของฉัน

อย่างไรก็ตามฉันกำลังมองหาไลบรารี JavaScript (เช่น jQuery, Prototype) ที่มีอยู่แล้ว :)

จากคำตอบโดย @CMS ฉันมีสิ่งต่อไปนี้ (ใน CoffeeScript ซึ่งสามารถแปลงเป็น JavaScript ได้อย่างง่ายดาย):

String::to_query = ->
  [result, re, d] = [{}, /([^&=]+)=([^&]*)/g, decodeURIComponent]
  while match = re.exec(if @.match /^\?/ then @.substring(1) else @)
    result[d(match[1])] = d match[2] 
  result

คุณสามารถคว้าสิ่งที่ต้องการได้อย่างง่ายดายด้วย:

location.search.to_query()['my_param']

การชนะในที่นี้คืออินเทอร์เฟซเชิงวัตถุ (แทนที่จะเป็นฟังก์ชัน) และสามารถทำได้กับสตริงใด ๆ (ไม่ใช่เฉพาะตำแหน่งค้นหา)

หากคุณใช้ไลบรารี JavaScript อยู่แล้วฟังก์ชันนี้จะมีอยู่แล้ว ตัวอย่างเช่นนี่คือเวอร์ชันของ Prototype