Adakah yang tahu cara yang baik untuk menulis ekstensi jQuery untuk menangani parameter string kueri? Saya pada dasarnya ingin memperluas ($)fungsi sihir jQuery sehingga saya dapat melakukan sesuatu seperti ini:

$('?search').val(); 

Yang akan memberi saya nilai "test" di URL berikut: http://www.example.com/index.php?search=test.

Saya telah melihat banyak fungsi yang dapat melakukan ini dalam jQuery dan Javascript, tetapi saya sebenarnya ingin memperluas jQuery agar berfungsi persis seperti yang ditunjukkan di atas. Saya tidak mencari plugin jQuery, saya mencari ekstensi ke metode jQuery.

Setelah bertahun-tahun penguraian string yang jelek, ada cara yang lebih baik: URLSearchParams Mari kita lihat bagaimana kita dapat menggunakan API baru ini untuk mendapatkan nilai dari lokasi!

// Dengan asumsi "? Post = 1234 & action = edit"

var urlParams = new URLSearchParams(window.location.search);
console.log(urlParams.has('post')); // true
console.log(urlParams.get('action')); // "edit"
console.log(urlParams.getAll('action')); // ["edit"]
console.log(urlParams.toString()); // "?post=1234&action=edit"
console.log(urlParams.append('active', '1')); // "?

post=1234&action=edit&active=1"

PEMBARUAN: IE tidak didukung

gunakan fungsi ini dari jawaban di bawah alih-alih URLSearchParams

$.urlParam = function (name) {
    var results = new RegExp('[\?&]' + name + '=([^&#]*)')
                      .exec(window.location.search);

    return (results !== null) ? results[1] || 0 : false;
}

console.log($.urlParam('action')); //edit

Mengapa memperpanjang jQuery? Apa manfaat memperluas jQuery vs hanya memiliki fungsi global?

function qs(key) {
    key = key.replace(/[*+?^$.\[\]{}()|\\\/]/g, "\\$&"); // escape RegEx meta chars
    var match = location.search.match(new RegExp("[?&]"+key+"=([^&]+)(&|$)"));
    return match && decodeURIComponent(match[1].replace(/\+/g, " "));
}

http://jsfiddle.net/gilly3/sgxcL/

Pendekatan alternatif adalah mem-parsing seluruh string kueri dan menyimpan nilai dalam suatu objek untuk digunakan nanti. Pendekatan ini tidak memerlukan ekspresi reguler dan memperluas window.locationobjek (tetapi, bisa dengan mudah menggunakan variabel global):

location.queryString = {};
location.search.substr(1).split("&").forEach(function (pair) {
    if (pair === "") return;
    var parts = pair.split("=");
    location.queryString[parts[0]] = parts[1] &&
        decodeURIComponent(parts[1].replace(/\+/g, " "));
});

http://jsfiddle.net/gilly3/YnCeu/

Versi ini juga menggunakan Array.forEach(), yang tidak tersedia secara native di IE7 dan IE8. Itu dapat ditambahkan dengan menggunakan implementasi di MDN , atau Anda dapat menggunakan jQuery's $.each()saja.

Plugin JQuery jQuery-URL-Parser melakukan pekerjaan yang sama, misalnya untuk mengambil nilai param string kueri penelusuran , Anda dapat menggunakan

$.url().param('search');

Perpustakaan ini tidak dikelola secara aktif. Seperti yang disarankan oleh penulis plugin yang sama, Anda dapat menggunakan URI.js .

Atau Anda dapat menggunakan js-url sebagai gantinya. Ini sangat mirip dengan yang di bawah ini.

Jadi, Anda dapat mengakses parameter kueri seperti $.url('?search')

Temukan permata ini dari teman-teman kami di SitePoint. https://www.sitepoint.com/url-parameters-jquery/ .

Menggunakan PURE jQuery. Saya hanya menggunakan ini dan itu berhasil. Tweak sedikit demi contoh.

//URL is http://www.example.com/mypage?ref=registration&[email protected]

$.urlParam = function (name) {
    var results = new RegExp('[\?&]' + name + '=([^&#]*)')
                      .exec(window.location.search);

    return (results !== null) ? results[1] || 0 : false;
}

console.log($.urlParam('ref')); //registration
console.log($.urlParam('email')); //[email protected]

Gunakan sesuka Anda.

Ini bukan contoh kode saya, tapi saya pernah menggunakannya di masa lalu.

//First Add this to extend jQuery

    $.extend({
      getUrlVars: function(){
        var vars = [], hash;
        var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
        for(var i = 0; i < hashes.length; i++)
        {
          hash = hashes[i].split('=');
          vars.push(hash[0]);
          vars[hash[0]] = hash[1];
        }
        return vars;
      },
      getUrlVar: function(name){
        return $.getUrlVars()[name];
      }
    });

    //Second call with this:
    // Get object of URL parameters
    var allVars = $.getUrlVars();

    // Getting URL var by its name
    var byName = $.getUrlVar('name');

Saya menulis sedikit fungsi di mana Anda hanya perlu mengurai nama parameter kueri. Jadi, jika Anda memiliki:? Project = 12 & Mode = 200 & date = 2013-05-27 dan Anda ingin parameter 'Mode' Anda hanya perlu menguraikan nama 'Mode' ke dalam fungsi:

function getParameterByName( name ){
    var regexS = "[\\?&]"+name+"=([^&#]*)", 
  regex = new RegExp( regexS ),
  results = regex.exec( window.location.search );
  if( results == null ){
    return "";
  } else{
    return decodeURIComponent(results[1].replace(/\+/g, " "));
  }
}

// example caller:
var result =  getParameterByName('Mode');

Membangun jawaban @Rob Neild di atas, berikut ini adalah adaptasi JS murni yang mengembalikan objek sederhana dari string string kueri yang diterjemahkan (no% 20's, dll).

function parseQueryString () {
  var parsedParameters = {},
    uriParameters = location.search.substr(1).split('&');

  for (var i = 0; i < uriParameters.length; i++) {
    var parameter = uriParameters[i].split('=');
    parsedParameters[parameter[0]] = decodeURIComponent(parameter[1]);
  }

  return parsedParameters;
}

Ditulis dalam Vanilla Javascript

     //Get URL
     var loc = window.location.href;
     console.log(loc);
     var index = loc.indexOf("?");
     console.log(loc.substr(index+1));
     var splitted = loc.substr(index+1).split('&');
     console.log(splitted);
     var paramObj = [];
     for(var i=0;i<splitted.length;i++){
         var params = splitted[i].split('=');
         var key = params[0];
         var value = params[1];
         var obj = {
             [key] : value
         };
         paramObj.push(obj);
         }
    console.log(paramObj);
    //Loop through paramObj to get all the params in query string.

function parseQueryString(queryString) {
    if (!queryString) {
        return false;
    }

    let queries = queryString.split("&"), params = {}, temp;

    for (let i = 0, l = queries.length; i < l; i++) {
        temp = queries[i].split('=');
        if (temp[1] !== '') {
            params[temp[0]] = temp[1];
        }
    }
    return params;
}

Saya menggunakan ini.