ฉันได้เห็นตัวอย่าง jQuery มากมายที่ไม่ทราบขนาดและชื่อพารามิเตอร์
URL ของฉันจะมี 1 สตริงเท่านั้น:
http://example.com?sent=yes
ฉันแค่ต้องการตรวจจับ:
- ไม่
sent
อยู่? - มันเท่ากับ "ใช่"?
ฉันได้เห็นตัวอย่าง jQuery มากมายที่ไม่ทราบขนาดและชื่อพารามิเตอร์
URL ของฉันจะมี 1 สตริงเท่านั้น:
http://example.com?sent=yes
ฉันแค่ต้องการตรวจจับ:
sent
อยู่?คำตอบ:
var getUrlParameter = function getUrlParameter(sParam) {
var sPageURL = window.location.search.substring(1),
sURLVariables = sPageURL.split('&'),
sParameterName,
i;
for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] === sParam) {
return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
}
}
};
และนี่คือวิธีการที่คุณสามารถใช้ฟังก์ชันนี้สมมติว่า URL
http://dummy.com/?technology=jquery&blog=jquerybyexample
ที่เป็น
var tech = getUrlParameter('technology');
var blog = getUrlParameter('blog');
false
หรือnull
เพื่อการค้นหาที่ว่างเปล่า
&
หรือ=
มีค่าพารามิเตอร์
ทางออกจากปี2020
เรามี: http://example.com?sent=yes
let searchParams = new URLSearchParams(window.location.search)
ไม่ส่ง มีอยู่ ?
searchParams.has('sent') // true
มันเท่ากับ "ใช่"?
let param = searchParams.get('sent')
แล้วเปรียบเทียบมัน
ข้อมูลโค้ด jQuery เพื่อรับตัวแปรแบบไดนามิกที่เก็บไว้ใน url เป็นพารามิเตอร์และเก็บไว้เป็นตัวแปร JavaScript ที่พร้อมใช้งานกับสคริปต์ของคุณ:
$.urlParam = function(name){
var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
if (results==null) {
return null;
}
return decodeURI(results[1]) || 0;
}
example.com?param1=name¶m2=&id=6
$.urlParam('param1'); // name
$.urlParam('id'); // 6
$.urlParam('param2'); // null
ตัวอย่างพารามิเตอร์ที่มีช่องว่าง
http://www.jquery4u.com?city=Gold Coast
console.log($.urlParam('city'));
//output: Gold%20Coast
console.log(decodeURIComponent($.urlParam('city')));
//output: Gold Coast
return results[1] || 0;
เป็นreturn decodeURI(results[1]) || 0;
|| 0
ส่วนเนื่องจากมีการตรวจสอบผลลัพธ์อยู่แล้วมันจะไม่ส่งคืนอาร์เรย์การจับคู่เสมอหรือไม่
ฉันติดสิ่งนี้เป็นหนึ่งบรรทัดเสมอ ตอนนี้ params มี vars:
params={};location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi,function(s,k,v){params[k]=v})
หลายเรียงราย:
var params={};
window.location.search
.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(str,key,value) {
params[key] = value;
}
);
เป็นฟังก์ชั่น
function getSearchParams(k){
var p={};
location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi,function(s,k,v){p[k]=v})
return k?p[k]:p;
}
ซึ่งคุณสามารถใช้เป็น:
getSearchParams() //returns {key1:val1, key2:val2}
หรือ
getSearchParams("key1") //returns val1
replace(/[?&;]+([^=]+)=([^&;]*)/gi
การเรียกใช้ ";" อักขระเป็นตัวคั่นด้วย
var params={};window.location.hash.replace(/[#&]+([^=&]+)=([^&]*)/gi,function(str,key,value){params[key] = value;});
สิ่งนี้มีประโยชน์สำหรับสิ่งต่าง ๆ เช่น AJAX ที่แฮชในหน้าต่างถูกอัพเดตด้วย ajax- คำร้องขอ แต่ยังมีผู้ใช้หนึ่ง ที่มีแฮช
อีกฟังก์ชั่นทางเลือก ...
function param(name) {
return (location.search.split(name + '=')[1] || '').split('&')[0];
}
param('t') == param('sent') == 'yes'
ในตัวอย่าง OP นี่คือการแก้ไข: return (location.search.split(new RegExp('[?&]' + name + '='))[1] || '').split('&')[0]
; นอกจากนี้โปรดทราบว่าคุณไม่สามารถบอกได้ว่ามีพารามิเตอร์อยู่หรือไม่เพราะคุณได้รับสตริงว่างสำหรับพารามิเตอร์ที่หายไป
return (location.search.split('?' + name + '=')[1] || location.search.split('&' + name + '=')[1] || '').split('&')[0];
อาจจะสายเกินไป แต่วิธีนี้ง่ายและง่ายมาก
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.url.js"></script>
<!-- URL: www.example.com/correct/?message=done&year=1990 -->
<script type="text/javascript">
$(function(){
$.url.attr('protocol') // --> Protocol: "http"
$.url.attr('path') // --> host: "www.example.com"
$.url.attr('query') // --> path: "/correct/"
$.url.attr('message') // --> query: "done"
$.url.attr('year') // --> query: "1990"
});
อัปเดต
ต้องใช้ปลั๊กอิน url: plugins.jquery.com/url
ขอบคุณ -Ripounet
หรือคุณสามารถใช้ฟังก์ชั่นเล็ก ๆ น้อย ๆ นี้ได้เพราะเหตุใดการแก้ปัญหาที่ซับซ้อนมากเกินไป?
function getQueryParam(param, defaultValue = undefined) {
location.search.substr(1)
.split("&")
.some(function(item) { // returns first occurence and stops
return item.split("=")[0] == param && (defaultValue = item.split("=")[1], true)
})
return defaultValue
}
ซึ่งดูดียิ่งขึ้นเมื่อง่ายและ onelined:
var queryDict = {};
location.search.substr(1).split("&").forEach(function(item) {queryDict[item.split("=")[0]] = item.split("=")[1]})
ผลลัพธ์: queryDict ['ส่ง'] // ไม่ได้กำหนดหรือ 'ค่า'
คุณจะเห็นคำตอบนี้ดีกว่า: ฉันจะรับค่าสตริงข้อความค้นหาใน JavaScript ได้อย่างไร
แอบสูงสุด
"?a=1&b=2&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab"
> queryDict
a: ["1", "5", "t e x t"]
b: ["2"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]
> queryDict["a"][1] // "5"
> queryDict.a[1] // "5"
การใช้URLSearchParams
:
var params = new window.URLSearchParams(window.location.search);
console.log(params.get('name'));
โปรดใช้ความระมัดระวังเกี่ยวกับความเข้ากันได้ (ส่วนใหญ่เป็นเรื่องปกติ แต่ IE และ Edge อาจแตกต่างกันตรวจสอบสิ่งนี้สำหรับการอ้างอิงที่เข้ากันได้: https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams )
อันนี้ง่ายและใช้งานได้สำหรับฉัน
$.urlParam = function(name){
var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
return results[1] || 0;
}
ดังนั้นหาก URL ของคุณคือhttp://www.yoursite.com?city=4
ลองนี้
console.log($.urlParam('city'));
บางทีคุณอาจต้องการที่จะให้ทันตแพทย์ JSดู? (ข้อจำกัดความรับผิดชอบ: ฉันเขียนรหัส)
รหัส:
document.URL == "http://helloworld.com/quotes?id=1337&author=kelvin&message=hello"
var currentURL = document.URL;
var params = currentURL.extract();
console.log(params.id); // 1337
console.log(params.author) // "kelvin"
console.log(params.message) // "hello"
ด้วย Dentist JS คุณสามารถเรียกใช้ฟังก์ชันแยก () บนสตริงทั้งหมด (เช่น document.URL.extract ()) และคุณจะได้ HashMap กลับมาจากพารามิเตอร์ทั้งหมดที่พบ นอกจากนี้ยังสามารถปรับแต่งเพื่อจัดการกับตัวคั่นและทั้งหมด
เวอร์ชันย่อ <1kb
ฉันหวังว่านี่จะช่วยได้
<script type="text/javascript">
function getParameters() {
var searchString = window.location.search.substring(1),
params = searchString.split("&"),
hash = {};
if (searchString == "") return {};
for (var i = 0; i < params.length; i++) {
var val = params[i].split("=");
hash[unescape(val[0])] = unescape(val[1]);
}
return hash;
}
$(window).load(function() {
var param = getParameters();
if (typeof param.sent !== "undefined") {
// Do something.
}
});
</script>
function GetRequestParam(param)
{
var res = null;
try{
var qs = decodeURIComponent(window.location.search.substring(1));//get everything after then '?' in URI
var ar = qs.split('&');
$.each(ar, function(a, b){
var kv = b.split('=');
if(param === kv[0]){
res = kv[1];
return false;//break loop
}
});
}catch(e){}
return res;
}
ลองตัวอย่างการทำงาน นี้http://jsfiddle.net/xy7cX/
API:
สิ่งนี้น่าจะช่วยได้ :)
รหัส
var url = "http://myurl.com?sent=yes"
var pieces = url.split("?");
alert(pieces[1] + " ===== " + $.inArray("sent=yes", pieces));
มีห้องสมุดที่ยอดเยี่ยมนี้: https://github.com/allmarkedup/purl
ซึ่งช่วยให้คุณทำง่ายๆ
url = 'http://example.com?sent=yes';
sent = $.url(url).param('sent');
if (typeof sent != 'undefined') { // sent exists
if (sent == 'yes') { // sent is equal to yes
// ...
}
}
ตัวอย่างสมมติว่าคุณกำลังใช้ jQuery คุณยังสามารถใช้งานได้เช่นเดียวกับจาวาสคริปต์ธรรมดาไวยากรณ์จะแตกต่างกันเล็กน้อย
นี้อาจจะ overkill แต่มีห้องสมุดที่เป็นที่นิยมสวยตอนนี้ใช้ได้สำหรับยูริแยกเรียกว่าURI.js
var uri = "http://example.org/foo.html?technology=jquery&technology=css&blog=stackoverflow";
var components = URI.parse(uri);
var query = URI.parseQuery(components['query']);
document.getElementById("result").innerHTML = "URI = " + uri;
document.getElementById("result").innerHTML += "<br>technology = " + query['technology'];
// If you look in your console, you will see that this library generates a JS array for multi-valued queries!
console.log(query['technology']);
console.log(query['blog']);
<script src="https://cdnjs.cloudflare.com/ajax/libs/URI.js/1.17.0/URI.min.js"></script>
<span id="result"></span>
ง่ายมากคุณสามารถใช้ url และรับค่า
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
ตัวอย่างการใช้งาน
// query string: ?first=value1&second=&value2
var foo = getParameterByName('first'); // "value1"
var bar = getParameterByName('second'); // "value2"
หมายเหตุ: หากพารามิเตอร์มีอยู่หลายครั้ง (? first = value1 & second = value2) คุณจะได้รับค่าแรก (value1) และค่าที่สองเป็น (value2)
สิ่งนี้จะช่วยให้คุณมีวัตถุที่น่าใช้
function queryParameters () {
var result = {};
var params = window.location.search.split(/\?|\&/);
params.forEach( function(it) {
if (it) {
var param = it.split("=");
result[param[0]] = param[1];
}
});
return result;
}
จากนั้น;
if (queryParameters().sent === 'yes') { .....
สิ่งนี้ขึ้นอยู่กับคำตอบของGazorisแต่ URL จะถอดรหัสพารามิเตอร์เพื่อให้สามารถใช้เมื่อมีข้อมูลอื่นที่ไม่ใช่ตัวเลขและตัวอักษร:
function urlParam(name){
var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
// Need to decode the URL parameters, including putting in a fix for the plus sign
// https://stackoverflow.com/a/24417399
return results ? decodeURIComponent(results[1].replace(/\+/g, '%20')) : null;
}
มีอีกตัวอย่างหนึ่งที่ใช้ไลบรารีURI.js
ตัวอย่างตอบคำถามตรงตามที่ถาม
var url = 'http://example.com?sent=yes';
var urlParams = new URI(url).search(true);
// 1. Does sent exist?
var sendExists = urlParams.sent !== undefined;
// 2. Is it equal to "yes"?
var sendIsEqualtToYes = urlParams.sent == 'yes';
// output results in readable form
// not required for production
if (sendExists) {
console.log('Url has "sent" param, its value is "' + urlParams.sent + '"');
if (urlParams.sent == 'yes') {
console.log('"Sent" param is equal to "yes"');
} else {
console.log('"Sent" param is not equal to "yes"');
}
} else {
console.log('Url hasn\'t "sent" param');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/URI.js/1.18.2/URI.min.js"></script>
http://example.com?sent=yes
function getUrlParameter(name) {
name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
var results = regex.exec(location.href);
return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
};
ด้วยฟังก์ชั่นด้านบนคุณสามารถรับค่าพารามิเตอร์แต่ละรายการ:
getUrlParameter('sent');
รุ่น Coffeescript ของคำตอบของ Sameer
getUrlParameter = (sParam) ->
sPageURL = window.location.search.substring(1)
sURLVariables = sPageURL.split('&')
i = 0
while i < sURLVariables.length
sParameterName = sURLVariables[i].split('=')
if sParameterName[0] == sParam
return sParameterName[1]
i++
การปรับปรุงเล็กน้อยเพื่อคำตอบของ Sameer แคช params เป็นปิดเพื่อหลีกเลี่ยงการแยกและวนลูปผ่านพารามิเตอร์ทั้งหมดทุกครั้งที่โทร
var getURLParam = (function() {
var paramStr = decodeURIComponent(window.location.search).substring(1);
var paramSegs = paramStr.split('&');
var params = [];
for(var i = 0; i < paramSegs.length; i++) {
var paramSeg = paramSegs[i].split('=');
params[paramSeg[0]] = paramSeg[1];
}
console.log(params);
return function(key) {
return params[key];
}
})();
ฉันใช้สิ่งนี้และใช้งานได้ http://codesheet.org/codesheet/NF246Tzs
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
var first = getUrlVars()["id"];
ด้วย vanilla JavaScript คุณสามารถนำ params (location.search) ได้อย่างง่ายดายรับซับสตริง (โดยไม่มี?) และเปลี่ยนเป็นอาร์เรย์โดยแยกโดย '&'
เมื่อคุณวนซ้ำผ่าน urlParams คุณสามารถแยกสตริงอีกครั้งด้วย '=' และเพิ่มลงในวัตถุ 'params' เป็นวัตถุ [elmement [0]] = องค์ประกอบ [1] ง่ายสุดและเข้าถึงได้ง่าย
http://www.website.com/?error=userError&type=handwritten
var urlParams = location.search.substring(1).split('&'),
params = {};
urlParams.forEach(function(el){
var tmpArr = el.split('=');
params[tmpArr[0]] = tmpArr[1];
});
var error = params['error'];
var type = params['type'];
จะทำอย่างไรถ้ามี & ในพารามิเตอร์ URL เช่น filename = "p & g.html" & uid = 66
ในกรณีนี้ฟังก์ชั่นที่ 1 จะทำงานไม่ถูกต้อง ดังนั้นฉันจึงแก้ไขรหัส
function getUrlParameter(sParam) {
var sURLVariables = window.location.search.substring(1).split('&'), sParameterName, i;
for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] === sParam) {
return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
}
}
}
เป็นที่ยอมรับฉันกำลังเพิ่มคำตอบให้กับคำถามที่ตอบแล้ว แต่สิ่งนี้มีข้อดีคือ:
- ไม่ขึ้นกับไลบรารีภายนอกใด ๆ รวมถึง jQuery
- ไม่สร้างมลภาวะเนมสเปซของฟังก์ชันโกลบอลโดยขยาย 'String'
- ไม่สร้างข้อมูลทั่วโลกและทำการประมวลผลที่ไม่จำเป็นหลังจากพบข้อมูลตรงกัน
- การจัดการปัญหาการเข้ารหัสและการยอมรับ (สมมติว่า) ชื่อพารามิเตอร์ที่ไม่ได้เข้ารหัส
- หลีกเลี่ยงการfor
วนซ้ำอย่างชัดเจน
String.prototype.urlParamValue = function() {
var desiredVal = null;
var paramName = this.valueOf();
window.location.search.substring(1).split('&').some(function(currentValue, _, _) {
var nameVal = currentValue.split('=');
if ( decodeURIComponent(nameVal[0]) === paramName ) {
desiredVal = decodeURIComponent(nameVal[1]);
return true;
}
return false;
});
return desiredVal;
};
จากนั้นคุณจะใช้มันเป็น:
var paramVal = "paramName".urlParamValue() // null if no match
หากคุณต้องการค้นหาพารามิเตอร์เฉพาะจาก URL ที่ระบุ:
function findParam(url, param){
var check = "" + param;
if(url.search(check )>=0){
return url.substring(url.search(check )).split('&')[0].split('=')[1];
}
}
var url = "http://www.yourdomain.com/example?id=1&order_no=114&invoice_no=254";
alert(findParam(url,"order_no"));
โซลูชันอื่นที่ใช้ jQuery และ JSON เพื่อให้คุณสามารถเข้าถึงค่าพารามิเตอร์ผ่านทางวัตถุ
var loc = window.location.href;
var param = {};
if(loc.indexOf('?') > -1)
{
var params = loc.substr(loc.indexOf('?')+1, loc.length).split("&");
var stringJson = "{";
for(var i=0;i<params.length;i++)
{
var propVal = params[i].split("=");
var paramName = propVal[0];
var value = propVal[1];
stringJson += "\""+paramName+"\": \""+value+"\"";
if(i != params.length-1) stringJson += ",";
}
stringJson += "}";
// parse string with jQuery parseJSON
param = $.parseJSON(stringJson);
}
สมมติว่า URL ของคุณคือ http://example.com/?search=hello+world&language=en&page=3
หลังจากนั้นเป็นเพียงเรื่องของการใช้พารามิเตอร์เช่นนี้:
param.language
เพื่อกลับไป
en
การใช้งานที่มีประโยชน์มากที่สุดของสิ่งนี้คือการเรียกใช้ที่โหลดหน้าและใช้ประโยชน์จากตัวแปรทั่วโลกเพื่อใช้พารามิเตอร์ทุกที่ที่คุณอาจต้องการพวกเขา
หากพารามิเตอร์ของคุณมีค่าตัวเลขให้ทำการแยกวิเคราะห์ค่า
parseInt(param.page)
หากไม่มีพารามิเตอร์param
ก็จะเป็นวัตถุว่างเปล่า
$.urlParam = function(name) {
var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
return results[1] || 0;
}
ใช้สิ่งนี้
$.urlParam = function(name) {
var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
return results[1] || 0;
}