Как получить переменные GET и POST с помощью JQuery?

Как мне просто получить значения GET и POST с помощью JQuery?

Я хочу сделать что-то вроде этого:

$('#container-1 > ul').tabs().tabs('select', $_GET('selectedTabIndex'));
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
96
0
275 034
14
Перейти к ответу Данный вопрос помечен как решенный

Ответы 14

Ответ принят как подходящий

Параметры GET можно взять из document.location.search:

var $_GET = {};

document.location.search.replace(/\??(?:([^=]+)=([^&]*)&?)/g, function () {
    function decode(s) {
        return decodeURIComponent(s.split("+").join(" "));
    }

    $_GET[decode(arguments[1])] = decode(arguments[2]);
});

document.write($_GET["test"]);

Для параметров POST вы можете сериализовать объект $_POST в формате JSON в тег <script>:

<script type = "text/javascript">
var $_POST = <?php echo json_encode($_POST); ?>;

document.write($_POST["test"]);
</script>

Пока вы занимаетесь этим (делаете что-то на стороне сервера), вы также можете собирать параметры GET на PHP:

var $_GET = <?php echo json_encode($_GET); ?>;

Примечание: Для использования встроенной функции json_encode вам понадобится PHP версии 5 или выше.


Обновлять: Вот более общая реализация:

function getQueryParams(qs) {
    qs = qs.split("+").join(" ");
    var params = {},
        tokens,
        re = /[?&]?([^=]+)=([^&]*)/g;

    while (tokens = re.exec(qs)) {
        params[decodeURIComponent(tokens[1])]
            = decodeURIComponent(tokens[2]);
    }

    return params;
}

var $_GET = getQueryParams(document.location.search);

Ваш метод извлечения не рассматривает аргументы без значения ("? Foo & bar = baz" => {foo: "", bar: "baz"}).

Gumbo 05.02.2009 18:01

Хороший улов, Гамбо! Знак = в регулярном выражении следует сделать необязательным: ... snip ... (?: = ([^ &] *))? &?) / G

Ates Goral 05.02.2009 19:18

1. Ваш первый пример GET, похоже, мне не подходит. 2. В вашем обновлении имя вашей функции содержит опечатку.

Jake Wilson 04.10.2009 06:36

Вы пробовали запустить это в сафари или в хроме? Это создает бесконечный цикл и приводит к сбою браузера. Попробуйте это с чем-нибудь таким простым, как "? P = 2"

MrColes 09.03.2011 00:12

@ Мистер Колз: Ой. Прошло много времени с тех пор, как я написал это. С тех пор я обнаружил, что Webkit не обновляет внутренний счетчик позиции объекта RegExp, когда он используется как литерал. Я обновлю свой ответ исправлением.

Ates Goral 09.03.2011 00:38

Я не думаю, что это может соответствовать массивам, отправленным через GET.

funforums 18.06.2014 15:20

@funforums Да, эта реализация не пытается поддерживать массивы. Кроме того, массив может быть закодирован в URL-адресе разными способами.

Ates Goral 18.06.2014 19:27

@AtesGoral Очень жаль, потому что текущая реализация уже может поддерживать массивы по крайней мере одним способом, если она действительно вставляла в массив результатов вместо того, чтобы выполнять присвоение переменной в цикле. У меня для этого есть рабочая модификация. Как вы думаете, мне стоит отредактировать это?

funforums 18.06.2014 20:32

Это красивый фрагмент кода, спасибо вам за это большое!

Edmund Rojas 15.03.2015 17:39

В вопросе OP нет упоминания PHP.

Mark W 25.01.2016 13:35

Была подсказка: $_GET. И OP принял это как правильный ответ еще в 2009 году, поэтому я думаю, что можно с уверенностью предположить, что проблема OP как-то связана с PHP.

Ates Goral 25.01.2016 20:56

Есть плагин для jQuery для получения параметров GET под названием .getUrlParams

Для POST единственным решением является отображение POST в переменной javascript с использованием PHP, как предложил Моран.

С любым серверным языком вам нужно будет передать переменные POST в javascript.

.СЕТЬ

var my_post_variable = '<%= Request("post_variable") %>';

Только будьте осторожны с пустыми значениями. Если переменная, которую вы пытаетесь создать, на самом деле пуста, вы получите синтаксическую ошибку javascript. Если вы знаете, что это строка, вам следует заключить ее в кавычки. Если это целое число, вы можете проверить, существует ли оно на самом деле, прежде чем записывать строку в javascript.

Однако у вас не всегда есть доступ к серверным языкам. Например, страницы GitHub ...

Adam B 11.11.2013 13:10

Вот кое-что, чтобы собрать все переменные GET в глобальный объект, процедура, оптимизированная за несколько лет. С появлением jQuery теперь кажется целесообразным хранить их в самом jQuery, я проверяю с Джоном возможную базовую реализацию.

jQuery.extend({
    'Q' : window.location.search.length <= 1 ? {}
        : function(a){
            var i = a.length, 
                r = /%25/g,  // Ensure '%' is properly represented 
                h = {};      // (Safari auto-encodes '%', Firefox 1.5 does not)
            while(i--) {
                var p = a[i].split('=');
                h[ p[0] ] = r.test( p[1] ) ? decodeURIComponent( p[1] ) : p[1];
            }
            return h;
        }(window.location.search.substr(1).split('&'))
});

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

switch ($.Q.event) {
    case 'new' :
        // http://www.site.com/?event=new
        $('#NewItemButton').trigger('click');
        break;
    default :
}

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

Вы можете попробовать плагин Объект строки запроса для jQuery.

Или вы можете использовать этот http://plugins.jquery.com/project/parseQuery, он меньше большинства (минимизированный 449 байт), возвращает объект, представляющий пары имя-значение.

Плагины jQuery кажутся хорошими, но мне нужна была быстрая функция js для анализа параметров get. Вот что я нашел.

http://www.bloggingdeveloper.com/post/JavaScript-QueryString-ParseGet-QueryString-with-Client-Side-JavaScript.aspx

почему бы не использовать старый добрый PHP? например, допустим, мы получили параметр GET 'target':

function getTarget() {
    var targetParam = "<?php  echo $_GET['target'];  ?>";
    //alert(targetParam);
}

Потому что это решение на стороне сервера, и вопрос касался стороны клиента / javascript / jQuery.

Hrvoje Kusulja 01.02.2014 01:37

@hkusulja добавляет оскорбление к травме: даже если вы это утверждаете, я все равно не понимаю, что вопрос исключительно на стороне сервера. я чувствую себя толстым как инструмент ...

tony gil 03.02.2014 20:50

Этот сценарий ужасен. Используйте это, если хотите, чтобы ваш сайт взломали. Всегда избегайте переменных, вводимых пользователем !! НЕ выводите $ _GET напрямую.

charj 05.08.2016 13:17

Для записи я хотел узнать ответ на этот вопрос, поэтому использовал метод PHP:

<script>
var jGets = new Array ();
<?
if (isset($_GET)) {
    foreach($_GET as $key => $val)
        echo "jGets[\"$key\"]=\"$val\";\n";
}
?>
</script>

Таким образом, весь мой javascript / jquery, который запускается после этого, может получить доступ ко всему в jGets. Мне кажется, это красивое элегантное решение.

Если ваш $ _GET многомерный, это может быть то, что вам нужно:

var $_GET = {};
document.location.search.replace(/\??(?:([^=]+)=([^&]*)&?)/g, function () {
    function decode(s) {
            return decodeURIComponent(s.split("+").join(" "));
    }

    //handling for multidimensional arrays
    if (decode(arguments[1]).indexOf("[]") > 0){
        var newName = decode(arguments[1]).substring(0, decode(arguments[1]).length - 2);
        if (typeof $_GET[newName] == 'undefined'){
            $_GET[newName] = new Array();
        }
        $_GET[newName].push(decode(arguments[2]));
    }else{
        $_GET[decode(arguments[1])] = decode(arguments[2]);
    }
});

Мой подход:

var urlParams;
(window.onpopstate = function () {
var match,
      pl     = /\+/g,  Regex for replacing addition symbol with a space
       search = /([^&=]+)=?([^&]*)/g,
      decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
       query  = window.location.search.substring(1);
   urlParams = {};
   while (match = search.exec(query))
    urlParams[decode(match[1])] = decode(match[2]);
})();

просто, но все же полезно получить переменные / значения из URL:

function getUrlVars() {
    var vars = [], hash, hashes = null;
    if (window.location.href.indexOf("?") && window.location.href.indexOf("&")) {
        hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    } else if (window.location.href.indexOf("?")) {
        hashes = window.location.href.slice(window.location.href.indexOf('?') + 1);
    }
    if (hashes != null) {
        for (var i = 0; i < hashes.length; i++) {
            hash = hashes[i].split('=');
            vars[hash[0]] = hash[1];
        }
    }
    return vars;
}

Я нашел это где-то в Интернете, только что исправил несколько ошибок

Используйте следующую функцию:

var splitUrl = function() {
    var vars = [], hash;
    var url = document.URL.split('?')[0];
    var p = document.URL.split('?')[1];
    if (p != undefined){
        p = p.split('&');
        for(var i = 0; i < p.length; i++){
            hash = p[i].split('=');
            vars.push(hash[1]);
            vars[hash[0]] = hash[1];
        }
    }
    vars['url'] = url;
    return vars;
};

и получить доступ к переменным как vars['index'], где 'index' - это имя переменной get.

Этот код не работает для UTL, таких как http://foo.com/?a=b#bar. Он считает, что b#bar - это ценность для a.

M.M 18.11.2015 08:00

Keep it simple

замените ПЕРЕМЕННАЯ_КЛЮЧ на ключ переменной, чтобы получить ее значение

 var get_value = window.location.href.match(/(?<=VARIABLE_KEY=)(.*?)[^&]+/)[0]; 

Другие вопросы по теме