Получить параметр url jquery или Как получить значения строк запроса в js

Я видел много примеров jQuery, где размер и имя параметра неизвестны. У моего url будет только одна строка:

http://example.com?sent=yes

Я просто хочу обнаружить:

  • Существует ли sent?
  • Он равен "да"?

Ответы

Ответ 1

Лучшее решение здесь.

var getUrlParameter = function getUrlParameter(sParam) {
    var sPageURL = window.location.search.substring(1),
        sURLVariables = sPageURL.split('&'),
        sParameterName,
        i;

    for (i = 0; i < sURLVariables.length; i++) {
        sParameterName = sURLVariables[i].split('=');

        if (sParameterName[0] === sParam) {
            return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
        }
    }
};

И вот как вы можете использовать эту функцию, предполагая, что URL,
http://dummy.com/?technology=jquery&blog=jquerybyexample.

var tech = getUrlParameter('technology');
var blog = getUrlParameter('blog');

Ответ 2

Решение с 2019 года

У нас есть: http://example.com?sent=yes

let searchParams = new URLSearchParams(window.location.search)

Есть ли послал существовать?

searchParams.has('sent') // true

Это равно "да"?

let param = searchParams.get('sent')

а затем просто сравните это.

Ответ 3

Фрагмент кода jQuery, чтобы получить динамические переменные, хранящиеся в URL-адресе в качестве параметров, и сохранить их в виде переменных JavaScript, готовых для использования с вашими сценариями:

$.urlParam = function(name){
    var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
    if (results==null) {
       return null;
    }
    return decodeURI(results[1]) || 0;
}

example.com?param1=name&param2=&id=6

$.urlParam('param1'); // name
$.urlParam('id');        // 6
$.urlParam('param2');   // null

пример params с пробелами

http://www.jquery4u.com?city=Gold Coast
console.log($.urlParam('city'));  
//output: Gold%20Coast



console.log(decodeURIComponent($.urlParam('city'))); 
//output: Gold Coast

Ответ 4

Я всегда придерживаюсь этого как одна строка. Теперь параметры имеют vars:

params={};location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi,function(s,k,v){params[k]=v})

многострочный:

var params={};
window.location.search
  .replace(/[?&]+([^=&]+)=([^&]*)/gi, function(str,key,value) {
    params[key] = value;
  }
);

как функция

function getSearchParams(k){
 var p={};
 location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi,function(s,k,v){p[k]=v})
 return k?p[k]:p;
}

который вы можете использовать как:

getSearchParams()  //returns {key1:val1, key2:val2}

или

getSearchParams("key1")  //returns val1

Ответ 5

Может быть, слишком поздно. Но этот метод очень прост и прост

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.url.js"></script>

<!-- URL:  www.example.com/correct/?message=done&year=1990 -->

<script type="text/javascript">
$(function(){
    $.url.attr('protocol')  // --> Protocol: "http"
    $.url.attr('path')      // --> host: "www.example.com"
    $.url.attr('query')         // --> path: "/correct/"
    $.url.attr('message')       // --> query: "done"
    $.url.attr('year')      // --> query: "1990"
});

UPDATE
Требуется плагин url: plugins.jquery.com/url
Спасибо -Ripounet

Ответ 6

Еще одна альтернативная функция...

function param(name) {
    return (location.search.split(name + '=')[1] || '').split('&')[0];
}

Ответ 7

Или вы можете использовать эту опрятную небольшую функцию, потому что почему слишком сложные решения?

function getQueryParam(param) {
    location.search.substr(1)
        .split("&")
        .some(function(item) { // returns first occurence and stops
            return item.split("=")[0] == param && (param = item.split("=")[1])
        })
    return param
}

который выглядит еще лучше при упрощении и onelined:

tl; dr однострочное решение

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

result:
queryDict['sent'] // undefined or 'value'

Но что, если у вас есть закодированные символы или многозначные ключи?

Вам лучше увидеть этот ответ: Как получить значения строки запроса в 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"]

> queryDict["a"][1] // "5"
> queryDict.a[1] // "5"

Ответ 8

Использование URLSearchParams:

var params = new window.URLSearchParams(window.location.search);
console.log(params.get('name'));

Будьте осторожны с совместимостью (в основном это нормально, но IE и Edge могут отличаться, проверьте это на предмет совместимости: https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams)

Ответ 9

Возможно, вы захотите дать Dentist JS взгляд? (отказ от ответственности: я написал код)

код:

document.URL == "http://helloworld.com/quotes?id=1337&author=kelvin&message=hello"
var currentURL = document.URL;
var params = currentURL.extract();
console.log(params.id); // 1337
console.log(params.author) // "kelvin"
console.log(params.message) // "hello"

с Dentist JS, вы можете в принципе вызвать функцию extract() для всех строк (например, document.URL.extract()), и вы получите HashMap всех найденных параметров. Он также настраивается для работы с разделителями и всеми.

Minified version < 1kb

Ответ 10

Это просто и работает для меня

$.urlParam = function(name){
    var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
    return results[1] || 0;
}

так что если ваш url http://www.yoursite.com?city=4

попробуйте это

console.log($.urlParam('city'));

Ответ 11

function GetRequestParam(param)
{
	var res = null;
	try{
		var qs = decodeURIComponent(window.location.search.substring(1));//get everything after then '?' in URI
		var ar = qs.split('&');
		$.each(ar, function(a, b){
			var kv = b.split('=');
			if(param === kv[0]){
				res = kv[1];
				return false;//break loop
			}
		});
	}catch(e){}
	return res;
}

Ответ 12

Надеюсь, это поможет.

 <script type="text/javascript">
   function getParameters() {
     var searchString = window.location.search.substring(1),
       params = searchString.split("&"),
       hash = {};

     if (searchString == "") return {};
     for (var i = 0; i < params.length; i++) {
       var val = params[i].split("=");
       hash[unescape(val[0])] = unescape(val[1]);
     }

     return hash;
   }

    $(window).load(function() {
      var param = getParameters();
      if (typeof param.sent !== "undefined") {
        // Do something.
      }
    });
</script>

Ответ 13

Там эта великолепная библиотека: https://github.com/allmarkedup/purl

который позволяет вам просто делать

url = 'http://example.com?sent=yes';
sent = $.url(url).param('sent');
if (typeof sent != 'undefined') { // sent exists
   if (sent == 'yes') { // sent is equal to yes
     // ...
   }
}

В примере предполагается, что вы используете jQuery. Вы также можете использовать его как простой javascript, тогда синтаксис будет немного другим.

Ответ 14

Это может быть чрезмерным, но есть довольно популярная библиотека, доступная для разбора URI, называемая URI.js.

Пример

var uri = "http://example.org/foo.html?technology=jquery&technology=css&blog=stackoverflow";
var components = URI.parse(uri);
var query = URI.parseQuery(components['query']);
document.getElementById("result").innerHTML = "URI = " + uri;
document.getElementById("result").innerHTML += "<br>technology = " + query['technology'];

// If you look in your console, you will see that this library generates a JS array for multi-valued queries!
console.log(query['technology']);
console.log(query['blog']);
<script src="https://cdnjs.cloudflare.com/ajax/libs/URI.js/1.17.0/URI.min.js"></script>

<span id="result"></span>

Ответ 15

Так просто, вы можете использовать любой url и получать значение

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
    results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
}

Пример использования

// query string: ?first=value1&second=&value2
var foo = getParameterByName('first'); // "value1"
var bar = getParameterByName('second'); // "value2"

Примечание. Если параметр присутствует несколько раз (? first = value1 & second = value2), вы получите первое значение (значение1) и второе значение как (значение2).

Ответ 16

Попробуйте эту рабочую демонстрацию http://jsfiddle.net/xy7cX/

API:

Это должно помочь :)

код

var url = "http://myurl.com?sent=yes"

var pieces = url.split("?");
alert(pieces[1] + " ===== " + $.inArray("sent=yes", pieces));

Ответ 17

Это даст вам хороший объект для работы с

    function queryParameters () {
        var result = {};

        var params = window.location.search.split(/\?|\&/);

        params.forEach( function(it) {
            if (it) {
                var param = it.split("=");
                result[param[0]] = param[1];
            }
        });

        return result;
    }

И затем;

    if (queryParameters().sent === 'yes') { .....

Ответ 18

Это основано на ответе Gazoris, но URL-адрес декодирует параметры, чтобы их можно было использовать, когда они содержат данные, отличные от цифр и букв:

function urlParam(name){
    var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
    // Need to decode the URL parameters, including putting in a fix for the plus sign
    // https://stackoverflow.com/a/24417399
    return results ? decodeURIComponent(results[1].replace(/\+/g, '%20')) : null;
}

Ответ 19

Существует еще один пример использования библиотеки URI.js.

Пример отвечает на вопросы точно так, как было задано.

var url = 'http://example.com?sent=yes';
var urlParams = new URI(url).search(true);
// 1. Does sent exist?
var sendExists = urlParams.sent !== undefined;
// 2. Is it equal to "yes"?
var sendIsEqualtToYes = urlParams.sent == 'yes';

// output results in readable form
// not required for production
if (sendExists) {
  console.log('Url has "sent" param, its value is "' + urlParams.sent + '"');
  if (urlParams.sent == 'yes') {
    console.log('"Sent" param is equal to "yes"');
  } else {
    console.log('"Sent" param is not equal to "yes"');
  }
} else {
  console.log('Url hasn\'t "sent" param');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/URI.js/1.18.2/URI.min.js"></script>

Ответ 20

http://example.com?sent=yes

Лучшее решение здесь.

function getUrlParameter(name) {
    name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
    var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
    var results = regex.exec(location.href);
    return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, '    '));
};

С помощью функции выше вы можете получить отдельные значения параметров:

getUrlParameter('sent');

Ответ 21

Вариант ответа Sameer на кофейни.

getUrlParameter = (sParam) ->
  sPageURL = window.location.search.substring(1)
  sURLVariables = sPageURL.split('&')
  i = 0
  while i < sURLVariables.length
    sParameterName = sURLVariables[i].split('=')
    if sParameterName[0] == sParam
      return sParameterName[1]
    i++

Ответ 22

Небольшое улучшение ответа Sameer, параметры кэша в закрытие, чтобы избежать разбора и циклирования всех параметров при каждом вызове

var getURLParam = (function() {
    var paramStr = decodeURIComponent(window.location.search).substring(1);
    var paramSegs = paramStr.split('&');
    var params = [];
    for(var i = 0; i < paramSegs.length; i++) {
        var paramSeg = paramSegs[i].split('=');
        params[paramSeg[0]] = paramSeg[1];
    }
    console.log(params);
    return function(key) {
        return params[key];
    }
})();

Ответ 23

Я использую это, и он работает. http://codesheet.org/codesheet/NF246Tzs

function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
    vars[key] = value;
    });
return vars;
}


var first = getUrlVars()["id"];

Ответ 24

С ванильным JavaScript вы можете легко взять params (location.search), получить подстроку (без?) и превратить ее в массив, разделив ее на "&".

Как вы итерации через urlParams, вы можете снова разбить строку с помощью "=" и добавить ее к объекту "params" в качестве объекта [elmement [0]] = element [1]. Супер простой и легкий доступ.

http://www.website.com/?error=userError&type=handwritten

            var urlParams = location.search.substring(1).split('&'),
                params = {};

            urlParams.forEach(function(el){
                var tmpArr = el.split('=');
                params[tmpArr[0]] = tmpArr[1];
            });


            var error = params['error'];
            var type = params['type'];

Ответ 25

Что делать, если есть и в параметре URL, например filename = "p & g.html" & uid = 66

В этом случае первая функция будет работать неправильно. Поэтому я изменил код

function getUrlParameter(sParam) {
    var sURLVariables = window.location.search.substring(1).split('&'), sParameterName, i;

    for (i = 0; i < sURLVariables.length; i++) {
        sParameterName = sURLVariables[i].split('=');

        if (sParameterName[0] === sParam) {
            return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
        }
    }
}

Ответ 26

По общему признанию, я добавляю свой ответ на вопрос с ответами, но это имеет следующие преимущества:

- не зависит от каких-либо внешних библиотек, включая jQuery

- Не загрязняющее пространство имен глобальных функций, расширяя 'String'

- Не создавать глобальные данные и делать ненужную обработку после найденного соответствия

- Обработка проблем с кодировкой и принятие (предполагаемого) имени некодированного параметра

- избегать явных for циклов

String.prototype.urlParamValue = function() {
    var desiredVal = null;
    var paramName = this.valueOf();
    window.location.search.substring(1).split('&').some(function(currentValue, _, _) {
        var nameVal = currentValue.split('=');
        if ( decodeURIComponent(nameVal[0]) === paramName ) {
            desiredVal = decodeURIComponent(nameVal[1]);
            return true;
        }
        return false;
    });
    return desiredVal;
};

Затем вы будете использовать его как:

var paramVal = "paramName".urlParamValue() // null if no match

Ответ 27

Если вы хотите найти определенный параметр из определенного URL:

function findParam(url, param){
  var check = "" + param;
  if(url.search(check )>=0){
      return url.substring(url.search(check )).split('&')[0].split('=')[1];
  }
}  

var url = "http://www.yourdomain.com/example?id=1&order_no=114&invoice_no=254";  
alert(findParam(url,"order_no"));

Ответ 28

    var url_param = GetURLParameter('name');

    function GetURLParameter(elem) {
        var sPageURL = window.location.search.substring(1);
        var sURLVariables = sPageURL.split('&');
        for (var i = 0; i < sURLVariables.length; i++)
        {
            var sParameterName = sURLVariables[i].split('=');
            if (sParameterName[0] == elem)
            {
                return decodeURIComponent(sParameterName[1]);
            }
        }
    }

Ответ 29

Другое решение, использующее jQuery и JSON, поэтому вы можете получить доступ к значениям параметров через объект.

var loc = window.location.href;
var param = {};
if(loc.indexOf('?') > -1)
{
    var params = loc.substr(loc.indexOf('?')+1, loc.length).split("&");

    var stringJson = "{";
    for(var i=0;i<params.length;i++)
    {
        var propVal = params[i].split("=");
        var paramName = propVal[0];
        var value = propVal[1];
        stringJson += "\""+paramName+"\": \""+value+"\"";
        if(i != params.length-1) stringJson += ",";
    }
    stringJson += "}";
    // parse string with jQuery parseJSON
    param = $.parseJSON(stringJson);
}

Предполагая, что ваш URL http://example.com/?search=hello+world&language=en&page=3

После этого это только вопрос использования таких параметров:

param.language

для возврата

en

Самое полезное использование этого - запустить его при загрузке страницы и использовать глобальную переменную для использования параметров в любом месте, где они вам могут понадобиться.

Если ваш параметр содержит числовые значения, просто проанализируйте значение.

parseInt(param.page)

Если параметров нет param будет просто пустым объектом.

Ответ 30

$.urlParam = function(name) {
  var results = new RegExp('[\?&amp;]' + name + '=([^&amp;#]*)').exec(window.location.href);
  return results[1] || 0;
}