bagaimana cara mendapatkan variabel GET dan POST dengan JQuery?

96

Bagaimana cara saya mendapatkan GETdan POSTmenilai dengan JQuery?

Yang ingin saya lakukan adalah seperti ini:

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

Jawaban:

171

Untuk parameter GET, Anda dapat mengambilnya dari 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"]);

Untuk parameter POST, Anda dapat membuat serial $_POSTobjek dalam format JSON menjadi <script>tag:

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

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

Saat Anda melakukannya (melakukan sesuatu di sisi server), Anda mungkin juga mengumpulkan parameter GET di PHP:

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

Catatan: Anda memerlukan PHP versi 5 atau lebih tinggi untuk menggunakan json_encodefungsi bawaan.


Pembaruan: Berikut implementasi yang lebih umum:

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);
Ates Goral
sumber
3
Metode ekstraksi Anda tidak mempertimbangkan argumen tanpa nilai (”? Foo & bar = baz“ => {foo: "", bar: "baz"}).
Gumbo
1
Tangkapan bagus Gumbo! = Di regex harus dibuat opsional: ... snip ... (?: = ([^ &] *))? &?) / G
Ates Goral
1. Contoh GET pertama Anda tampaknya tidak berhasil bagi saya. 2. Dalam pembaruan Anda, nama fungsi Anda memiliki kesalahan ketik di dalamnya
Jake Wilson
Sudahkah Anda mencoba menjalankannya di safari atau chrome? Ini menciptakan loop tak terbatas dan merusak browser. Cobalah dengan sesuatu yang sederhana seperti "? P = 2"
MrColes
@MrColes: Astaga. Sudah lama sejak saya menulis ini. Sejak itu, saya telah menemukan bahwa Webkit tidak memperbarui penghitung posisi internal objek RegExp saat digunakan sebagai literal. Saya akan memperbarui jawaban saya dengan perbaikan.
Ates Goral
16

Ada plugin untuk jQuery untuk mendapatkan GET params yang disebut .getUrlParams

Untuk POST, satu-satunya solusi adalah menggemakan POST ke dalam variabel javascript menggunakan PHP, seperti yang disarankan Moran.

Leandro Ardissone
sumber
6

mengapa tidak menggunakan PHP lama yang bagus? misalnya, katakanlah kita menerima parameter GET 'target':

function getTarget() {
    var targetParam = "<?php  echo $_GET['target'];  ?>";
    //alert(targetParam);
}
tony gil
sumber
7
Karena ini adalah solusi sisi server, dan pertanyaannya adalah tentang sisi klien / javascript / jQuery.
Hrvoje Kusulja
@hkusulja menambahkan penghinaan ke cedera: meskipun Anda menegaskannya, saya masih tidak dapat melihat bahwa pertanyaannya secara eksklusif sisi server. saya merasa tebal sebagai alat ...
tony gil
1
Skrip ini mengerikan. Gunakan ini jika Anda ingin situs Anda diretas. Selalu melarikan diri dari variabel yang dimasukkan pengguna !! JANGAN mengeluarkan $ _GET secara langsung.
charj
3

Dengan bahasa sisi server apa pun, Anda harus memancarkan variabel POST ke dalam javascript.

.BERSIH

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

Berhati-hatilah dengan nilai kosong. Jika variabel yang Anda coba keluarkan benar-benar kosong, Anda akan mendapatkan kesalahan sintaks javascript. Jika Anda tahu itu string, Anda harus membungkusnya dengan tanda kutip. Jika itu bilangan bulat, Anda mungkin ingin menguji untuk melihat apakah itu benar-benar ada sebelum menulis baris ke javascript.

EndangeredMassa
sumber
1
Anda tidak selalu memiliki akses ke bahasa sisi server. Misalnya halaman GitHub ...
Adam B
2

Anda dapat mencoba plugin Query String Object untuk jQuery.

Burak Erdem
sumber
2

Inilah sesuatu untuk mengumpulkan semua GETvariabel dalam objek global, rutinitas yang dioptimalkan selama beberapa tahun. Sejak munculnya jQuery, sekarang tampaknya tepat untuk menyimpannya di jQuery itu sendiri, saya memeriksa dengan John tentang implementasi inti potensial.

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

Contoh penggunaan:

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

Semoga ini membantu. ;)

Matt Gardner
sumber
1

Jika $ _GET Anda multidimensi, ini mungkin yang Anda inginkan:

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

sederhana, namun berguna untuk mendapatkan vars / values ​​dari 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;
}

Saya menemukannya di suatu tempat di internet, hanya memperbaiki beberapa bug

Lukas Liesis
sumber
1

Gunakan fungsi berikut:

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

dan mengakses variabel seperti di vars['index']mana 'index'nama variabel get.

ashsam786
sumber
Kode ini gagal untuk UTL seperti http://foo.com/?a=b#bar. Ia pikir b#baradalah nilai untuk a.
MM
1

Tetap sederhana

ganti VARIABLE_KEY dengan kunci variabel untuk mendapatkan nilainya

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

Sekadar catatan, saya ingin tahu jawaban atas pertanyaan ini, jadi saya menggunakan metode PHP:

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

Dengan begitu semua javascript / jquery saya yang berjalan setelah ini dapat mengakses semua yang ada di jGets. Saya rasa ini adalah solusi elegan yang bagus.

Chud37
sumber
0

Pendekatan saya:

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