jak uzyskać zmienne GET i POST z JQuery?


96

Jak to po prostu dostać GETiPOST wartości wartości za pomocą JQuery?

To, co chcę zrobić, to coś takiego:

$('#container-1 > ul').tabs().tabs('select', $_GET('selectedTabIndex'));

Odpowiedzi:


171

Parametry GET można pobrać z 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"]);

W przypadku parametrów POST można serializować $_POSTobiekt w formacie JSON do <script>tagu:

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

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

Podczas gdy jesteś na tym (robiąc rzeczy po stronie serwera), możesz również zebrać parametry GET w PHP:

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

Uwaga: aby korzystać z wbudowanej json_encodefunkcji, potrzebujesz PHP w wersji 5 lub nowszej .


Aktualizacja: Oto bardziej ogólna implementacja:

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);

3
Twoja metoda wyodrębniania nie uwzględnia argumentów bez wartości (”? Foo & bar = baz“ => {foo: "", bar: "baz"}).
— Gumbo

1
Niezły chwyt Gumbo! = W wyrażeniu regularnym powinno być opcjonalne: ... snip ... (?: = ([^ &] *))? &?) / G
— Ates Goral

1. Twój pierwszy przykład GET wydaje się nie działać dla mnie. 2. W Twojej aktualizacji nazwa funkcji zawiera literówkę
— Jake Wilson

Czy próbowałeś uruchomić to w Safari lub Chrome? Tworzy nieskończoną pętlę i powoduje awarię przeglądarki. Wypróbuj coś tak prostego, jak „? P = 2”
— MrColes

@MrColes: Yikes. Minęło trochę czasu, odkąd to napisałem. Od tego czasu odkryłem, że Webkit nie aktualizuje wewnętrznego licznika pozycji obiektu RegExp, gdy jest używany jako literał. Zaktualizuję moją odpowiedź poprawką.
— Ates Goral

16

Istnieje wtyczka do jQuery, która pobiera parametry GET o nazwie .getUrlParams

W przypadku POST jedynym rozwiązaniem jest powtórzenie testu POST do zmiennej javascript za pomocą PHP, jak sugerował Moran.


6

dlaczego nie użyć starego dobrego PHP? na przykład, powiedzmy, że otrzymujemy parametr GET „target”:

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

7
Ponieważ jest to rozwiązanie po stronie serwera, a pytanie dotyczyło strony klienta / javascript / jQuery.
— Hrvoje Kusulja

@hkusulja dodaje zniewagę do obrażeń: mimo że to potwierdzasz, nadal nie widzę, że pytanie dotyczy wyłącznie strony serwera. Czuję się gruby jak narzędzie ...
— tony gil

1
Ten skrypt jest ohydny. Użyj tego, jeśli chcesz zhakować swoją witrynę. Zawsze unikaj zmiennych wprowadzonych przez użytkownika !! NIE wyświetlaj wartości $ _GET bezpośrednio.
— charj,


3

W przypadku dowolnego języka po stronie serwera będziesz musiał emitować zmienne POST do javascript.

.NETTO

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

Uważaj tylko na puste wartości. Jeśli zmienna, którą próbujesz wyemitować, jest w rzeczywistości pusta, pojawi się błąd składni JavaScript. Jeśli wiesz, że to ciąg, powinieneś zawinąć go w cudzysłów. Jeśli jest to liczba całkowita, przed zapisaniem wiersza do javascript możesz przetestować, czy rzeczywiście istnieje.


1
Jednak nie zawsze masz dostęp do języków po stronie serwera. Na przykład strony GitHub ...
— Adam B


2

Oto coś, co pozwoli zebrać wszystkie GETzmienne w obiekcie globalnym, procedura zoptymalizowana przez kilka lat. Od czasu powstania jQuery wydaje się właściwe przechowywanie ich w samym jQuery, sprawdzam z Johnem potencjalną implementację jądra.

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('&'))
});

Przykładowe użycie:

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

Mam nadzieję że to pomoże. ;)



1

Jeśli Twój $ _GET jest wielowymiarowy, może to być to, czego chcesz:

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]);
    }
});

1

proste, ale przydatne do pobierania zmiennych / wartości z adresu 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;
}

Znalazłem to gdzieś w internecie, właśnie naprawiłem kilka błędów


1

Użyj następującej funkcji:

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;
};

i uzyskaj dostęp do zmiennych, tak jak vars['index']gdzie 'index'jest nazwa zmiennej get.


Ten kod nie działa w przypadku UTL, takich jak http://foo.com/?a=b#bar. Uważa, że b#barjest to wartość a.
— MM

1

Nie komplikuj

zamień VARIABLE_KEY na klucz zmiennej, aby uzyskać jej wartość

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

0

Tak dla przypomnienia, chciałem poznać odpowiedź na to pytanie, więc użyłem metody PHP:

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

W ten sposób wszystkie moje uruchomione javascript / jquery będą miały dostęp do wszystkiego w jGets. Czuję, że to ładne, eleganckie rozwiązanie.


0

Moje podejście:

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]);
})();
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.