Xây dựng một URL với các thông số sử dụng jQuery

Question

Tôi có ví dụ URL sau được lưu trữ trong một biến toàn cầu:

var myUrl = "http://mydomain.com/something?row=1"; 

Sau đó, một hàm có thêm giả sử một tham số gọi là "cột". Làm thế nào mà chức năng đó sẽ thêm các tham số vào một chuỗi URL có sẵn bằng cách sử dụng jQuery?

Ví dụ về chuỗi tạo ra mong đợi:

"http://mydomain.com/something?row=1&column=9" 

Vấn đề là myUrl cũng có thể chỉ là:

var myUrl = "http://mydomain.com/something"; 

(Chú ý rằng có những thông số không tồn tại trước)

Answer 1

Kiểm tra hàm jQuery .param(), điều đó sẽ thực hiện thủ thuật.

http://api.jquery.com/jQuery.param/

Bạn có thể sau đó chỉ cần tạo ra một chức năng mà gắn thêm chuỗi được tạo ra bởi .param() để url.

Answer 2

Bạn không cần jQuery, sử dụng một chức năng như thế này:

var buildUrl = function(base, key, value) { 
    var sep = (base.indexOf('?') > -1) ? '&' : '?'; 
    return base + sep + key + '=' + value; 
} 

Bạn sẽ sử dụng nó như thế này:

buildUrl('http://www.example.com/foo', 'test', '123'); 
buildUrl('http://www.example.com/foo?bar=baz', 'test', '123'); 

Answer 3

Bạn có thể thử này.

myUrl += ((myUrl.indexOf('?') == -1) ? '?' : '&'); 
myUrl += "column=9"; 

Answer 4

if (myUrl.indexOf("?") != -1){ 
    // contains query string 
} 
else 
{ 
    // doesn't 
} 

Answer 5

Giữ mọi thứ trong một đối tượng cho đến khi bạn thực sự cần một chuỗi.

Đầu tiên cư đối tượng từ một số giá trị ban đầu:

var $_GET = location.search.substr(1).split("&").reduce(function(obj, val){ 
    if(!val) return obj; 
    var pair = val.split("="); 
    obj[pair[0]] = pair[1]; 
    return obj; 
}, {}); 

Xét url ban đầu là: "http://mydomain.com/something?row=1&column=9"

$_GET['column'] = 5; 

$.param($_GET); //"row=1&column=5" 

Array#reduce

Answer 6

var myUrl = "http://mydomain.com/something"; 

function addQSParm(name, value) { 
    var re = new RegExp("([?&]" + name + "=)[^&]+", ""); 

    function add(sep) { 
     myUrl += sep + name + "=" + encodeURIComponent(value); 
    } 

    function change() { 
     myUrl = myUrl.replace(re, "$1" + encodeURIComponent(value)); 
    } 
    if (myUrl.indexOf("?") === -1) { 
     add("?"); 
    } else { 
     if (re.test(myUrl)) { 
      change(); 
     } else { 
      add("&"); 
     } 
    } 
} 

console.log(myUrl); 

addQSParm("foo", "asdf"); 
console.log(myUrl); 

addQSParm("bar", "qwerty"); 
console.log(myUrl); 

addQSParm("foo", "123"); 
console.log(myUrl); 

jsFiddle