2014-10-08 76 views
1

我想創建一個函數來從url中刪除特定的查詢字符串和它的值。從URL中刪除特定的查詢字符串

對於如: 如果我有像

VAR URL中的URL = www.foo.com/test?name=kevin &性別=男& ID = 1234

如果我通過名稱 - >它應該刪除名稱的鍵和值。該URL應該成爲

www.foo.com/test?gender=Male & ID = 1234

我有一個函數ReturnRefinedURL(key,url)

和我在功能做這個

function ReturnRefinedURL(key,url) 
{ 
var Value = getParameterByName(key); // This returns kevin 
var stringToBeRemoved = 'key +'='+ Value+'&'; // string becomes 'name=kevin&' 
return url.replace(stringToBeRemoved, ''); 
} 

//在Google中找到它:

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

所以當我調用該方法ReturnRefinedURL('name',window.location.href);

這工作!但尋找一種更優雅,更傻的方法。
*這不會工作,如果名稱參數是查詢字符串中的第二個。 (以下簡稱「&」仍將被保留)

回答

8

更多的搜索點點,然後你可以最終here

var url = "www.foo.com/test?name=kevin&gender=Male&id=1234"; 
function removeURLParameter(url, parameter) { 
    //prefer to use l.search if you have a location/link object 
    var urlparts= url.split('?'); 
    if (urlparts.length>=2) { 

     var prefix= encodeURIComponent(parameter)+'='; 
     var pars= urlparts[1].split(/[&;]/g); 

     //reverse iteration as may be destructive 
     for (var i= pars.length; i-- > 0;) {  
      //idiom for string.startsWith 
      if (pars[i].lastIndexOf(prefix, 0) !== -1) { 
       pars.splice(i, 1); 
      } 
     } 

     url= urlparts[0]+'?'+pars.join('&'); 
     return url; 
    } else { 
     return url; 
    } 
} 

console.log(removeURLParameter(url, 'name')); 
console.log(removeURLParameter(url, 'gender')); 

Jsfiddle example

+0

非常感謝..不知道我錯過了鏈接。我沒有搜索!:( – 2014-10-08 19:15:05

+0

您可以請提供一個解決方案,它可以添加參數的單擊事件,也可以刪除該事件的參數 即我想添加新的參數或更改現有參數的值,並刪除一個單一的現有參數點擊 – Hetal1311 2017-08-13 17:38:27

+0

可以更新區分大小寫的問題嗎? – Yiping 2017-10-26 07:08:49

1

你可以簡單地這樣做

function returnRefinedURL(key, url){ 
    return url.replace(new RegExp(key + "=\\w+"),"").replace("?&","?") 
    .replace("&&","&"); 
} 

測試的所有用例和上述作品完美。

+0

我想你的method..it工作正常,當我通過行業..但是當我通過類別..它打破..你能告訴我什麼是錯的?我試過的網址:''http://foo.com/en-gb/search-results?k=&l=&a=1&b=5&industry=technology%7c&jobCategories=ba%7cba%5cCOMMERCIAL%7cba%5cCORPORATE%7c' – 2014-10-08 18:43:01

0

我建議:

// obviously in real use, you could just access 'document.location' 
 
// within the function: 
 
function returnRefinedURL (key, url) { 
 
    // separating the key-value ('search') portion of the URL from the rest: 
 
    var urlParts = url.split('?'); 
 
    // if we have only a single array-element, or if the key to remove 
 
    // is not found in the URL, we quit here and return the same unchanged URL: 
 
    if (urlParts.length === 1 || url.indexOf(key) === -1) { 
 
     // there were no parameters, or the 
 
     // key wasn't present 
 
     return url; 
 
    } 
 
    else { 
 
     // otherwise, we split the key-value string on the '&' characters, 
 
     // for an array of key=value strings: 
 
     var keyValues = urlParts[1].split('&'), 
 
     // filtering that array: 
 
      refinedKeyValues = keyValues.filter(function (keyValuePair) { 
 
       // keeping only those array elements that don't /start with/ 
 
       // the key to be removed: 
 
       return keyValuePair.indexOf(key) !== 0; 
 
      // joining the key=value pairs back into a string: 
 
      }).join('&'); 
 
    } 
 
    // returning the refined URL: 
 
    return urlParts[0] + '?' + refinedKeyValues; 
 
} 
 

 
// beyond this point is entirely irrelevant, it's just for visual feedback: 
 
document.getElementById('output').textContent = returnRefinedURL('name', 'www.foo.com/test?name=kevin&gender=Male&id=1234');
#output::before { 
 
    content: 'output: '; 
 
}
<div id="output"></div>

參考文獻: