JQuery / জাভাস্ক্রিপ্টের সাথে ক্যোরিয় স্ট্রিং প্যারামিটারের url মানগুলি পান (ক্যোরিস্ট্রিং)


149

কোয়েরি স্ট্রিং প্যারামিটারগুলি পরিচালনা করতে jQuery এক্সটেনশন লিখতে ভাল উপায় সম্পর্কে যে কেউ জানেন? আমি মূলত jQuery যাদু ($)ফাংশনটি প্রসারিত করতে চাই যাতে আমি এরকম কিছু করতে পারি:

$('?search').val(); 

কে আমাকে দিতে হবে নিম্নলিখিত URL- মান "পরীক্ষা": http://www.example.com/index.php?search=test

আমি jQuery এবং জাভাস্ক্রিপ্ট এ এটি করতে পারে যে অনেক ফাংশন দেখেছি, কিন্তু আমি আসলে jQuery উপরোক্ত প্রদর্শিত হিসাবে ঠিক কাজ করতে প্রসারিত করতে চান। আমি কোন jQuery প্লাগইন খুঁজছি না, আমি jQuery পদ্ধতিতে একটি এক্সটেনশন খুঁজছি।


4
জিজ্ঞাসা করা হয়েছে এবং উত্তর দেওয়া হয়েছে: স্ট্যাকওভারফ্লো.com
নিকো ওয়েস্টারডেল

1
@ নিকোওয়েস্টারডেল - আমি সেই লিঙ্কটি পেরিয়েছি, তবে এই উত্তরটি সমাধান করে এমন কোনও উত্তর দেখেনি। তিনি বলেছিলেন যে তিনি ঠিক উপরের মতো চান।
mrtsherman

2
আমি মনে করি না আপনি এটি করতে পারেন, একটি স্ট্রিং সিজলার দ্বারা পার্স হয়ে যায়, তারপরে DOM অবজেক্টের অ্যারেতে সমাধান হয়। আপনি কাস্টম ফিল্টার সরবরাহ করতে ম্যাচারটি প্রসারিত করতে পারেন, তবে স্ট্রিংয়ের উপর ভিত্তি করে আপনার জেকারি অবজেক্ট থাকতে পারে না।
অ্যান্ড্রু

6
$ওভারলোড কি পর্যাপ্ত নয়?
কোয়ান্টিন

1
@ মিঃশেরম্যান আমার দেওয়া লিঙ্কটিতে getParameterByName () ফাংশনটি দেখুন। না আপনি এটি সরাসরি $ প্রম্পটের মধ্যে থেকে করতে পারবেন না, তবে এটি jQuery নির্বাচকদের জন্য নয়। তিনি কেবল একটি ইউআরএল স্ট্রিংয়ের অংশ নির্বাচন করছেন, the () যা করেন তা ডিওএম-র অংশটি অ্যাক্সেস করার চেষ্টা করছেন না। এটি সম্পূর্ণ আলাদা জিনিস। আপনি যদি সত্যিই jQuery ব্যবহার করতে চান তবে আপনি এমন একটি প্লাগইন লিখতে পারেন যা এই সিনট্যাক্সটি ব্যবহার করেছিল: get .getParameterByName (প্যারাম), আমি যে পৃষ্ঠায় লিঙ্ক করেছি তার নিচে আরও একটি উদাহরণ রয়েছে যা ঠিক এটি করে। কিন্ডা অর্থহীন যদিও।
নিকো ওয়েস্টারডেল

উত্তর:


46

কয়েক বছর ধরে কুরুচিপূর্ণ স্ট্রিং পার্সিংয়ের পরে, এর থেকে আরও ভাল উপায় আছে: URLS SearchParams আসুন আমরা কীভাবে এই নতুন API ব্যবহার করতে পারি সেই অবস্থান থেকে মানগুলি পেতে!

// ধরে নিচ্ছেন "? পোস্ট = 1234 & ক্রিয়া = সম্পাদনা"

var urlParams = new URLSearchParams(window.location.search);
console.log(urlParams.has('post')); // true
console.log(urlParams.get('action')); // "edit"
console.log(urlParams.getAll('action')); // ["edit"]
console.log(urlParams.toString()); // "?post=1234&action=edit"
console.log(urlParams.append('active', '1')); // "?

post=1234&action=edit&active=1"

আপডেট: আইই সমর্থিত নয়

URLSearchParams এর পরিবর্তে নীচের উত্তর থেকে এই ফাংশনটি ব্যবহার করুন

$.urlParam = function (name) {
    var results = new RegExp('[\?&]' + name + '=([^&#]*)')
                      .exec(window.location.search);

    return (results !== null) ? results[1] || 0 : false;
}

console.log($.urlParam('action')); //edit

1
ইউআরএল সার্চপ্যারামগুলি কি সমস্ত ব্রাউজার দ্বারা সমর্থিত?
দিব্যি

ওহো! ওহ ম্যান, আইই সমর্থিত নয় !! আমি সবেমাত্র এটি পরীক্ষা করেছি। ক্রোম, এফএফ, সাফারিতে কোনও সমস্যা নেই।
সৌরিন

1
@ ডিভাইন - এখানে ইউআরএলস অনুসন্ধানের জন্য একটি পলিফিল রয়েছে: github.com/WebReflection/url-search-params
রবার্তো

আপনি যদি অসমর্থিত ব্রাউজারগুলির জন্য একটি পলিফিল যোগ করেন তবে এই URLS SearchParams সমাধানটি ভাল কাজ করে। github.com/ungap/url-search-params
লুইসভডউ

104

কেন jQuery প্রসারিত? JQuery বনাম কেবলমাত্র একটি বিশ্বব্যাপী ক্রিয়াকলাপ বাড়িয়ে কী লাভ হবে?

function qs(key) {
    key = key.replace(/[*+?^$.\[\]{}()|\\\/]/g, "\\$&"); // escape RegEx meta chars
    var match = location.search.match(new RegExp("[?&]"+key+"=([^&]+)(&|$)"));
    return match && decodeURIComponent(match[1].replace(/\+/g, " "));
}

http://jsfiddle.net/gilly3/sgxcL/

একটি বিকল্প পন্থাটি হ'ল পুরো ক্যোরিয় স্ট্রিংকে বিশ্লেষণ করা এবং পরে ব্যবহারের জন্য কোনও বস্তুতে মানগুলি সংরক্ষণ করা। এই পদ্ধতির কোনও নিয়মিত প্রকাশের প্রয়োজন হয় না এবং window.locationঅবজেক্টটি প্রসারিত করে (তবে, কেবলমাত্র সহজেই একটি বিশ্বব্যাপী পরিবর্তনশীল ব্যবহার করতে পারে):

location.queryString = {};
location.search.substr(1).split("&").forEach(function (pair) {
    if (pair === "") return;
    var parts = pair.split("=");
    location.queryString[parts[0]] = parts[1] &&
        decodeURIComponent(parts[1].replace(/\+/g, " "));
});

http://jsfiddle.net/gilly3/YnCeu/

এই সংস্করণটি ব্যবহার করে Array.forEach(), যা আই 7 এবং আই 8 এ স্থানীয়ভাবে অনুপলব্ধ। এটি এমডিএন এ প্রয়োগ ব্যবহার করে যুক্ত করা যেতে পারে , বা আপনি এর $.each()পরিবর্তে jQuery এর ব্যবহার করতে পারেন ।


2
এটি সাধারণ নয় তবে ক্যোয়ারি প্যারামিটারগুলিতে এম্পারস্যান্ডগুলির পরিবর্তে আধা-কলোন ব্যবহার করা বৈধ।
মুহাদ

@ মুহদ - আপনার কোডটি যতক্ষণ না বোঝে ততক্ষণ কোনও ক্যুরিস্ট্রিংয়ে আপনার পছন্দ মতো যে কোনও ডিলিমিটার ব্যবহার করা এটি "বৈধ"। কিন্তু, যখন কোনও ফর্ম জমা দেওয়া হয়, ফর্ম ক্ষেত্রগুলি name=valueপৃথক পৃথকভাবে জোড়া হিসাবে জমা দেওয়া হয় &। যদি আপনার কোড একটি কাস্টম ক্যোরিস্ট্রিং ফর্ম্যাট ব্যবহার করে, স্পষ্টতই, সার্ভারে বা ক্লায়েন্টে যেখানেই ক্যোরিস্ট্রিং গ্রাস করা হয়েছে সেখানেই আপনাকে একটি কাস্টম ক্যোরিস্ট্রিং পার্সার লিখতে হবে।
গিলি 3

2
@ নিক - আকর্ষণীয় তবে এইচটিটিপি সার্ভারগুলির জন্য সেমি-কোলনকে অ্যাম্পারস্যান্ড হিসাবে চিকিত্সার জন্য তাদের পরামর্শ কেবল ফর্ম জমা দেওয়ার নকল করার জন্য একটি লিঙ্ক ব্যবহার করার সময় এইচটিএমএল প্রিটিয়ার তৈরি করতে পরিবেশন করে। এটি কেবল একটি পরামর্শ এবং মানহীন। একটি স্ট্যান্ডার্ড ফর্ম GETজমা দেওয়ার সাথে এনকোড করা হয় application/x-www-form-urlencoded, মানগুলি পৃথক করে &। আমার কোডটি সেই মানটিকে পরিচালনা করে। কাস্টম ইউআরএল স্ট্রাকচার যেমন আপনি লিঙ্ক করেছেন তার জন্য কাস্টম পার্সার সার্ভার-সাইড এবং ক্লায়েন্ট-সাইড প্রয়োজন হবে। নির্বিশেষে, আমার কোডে এ জাতীয় ক্ষমতা যুক্ত করা তুচ্ছ হবে।
gille3

1
@ গিলি প্রকৃতপক্ষে - আপনি যদি পোর্টেবল কোড চান তবে আপনার উভয়কেই সমর্থন করা দরকার
নিক

1
RegExp () এ "i" যুক্ত করুন যাতে কীটি সংবেদনশীল হতে পারে: নতুন RegExp ("[? &]" + কী + "= ([^ &] +) (& | $)", "আমি"));
যোভাভ

94

JQuery jQuery-URL- পার্সার প্লাগইন একই কাজ করে, উদাহরণস্বরূপ অনুসন্ধান কোয়েরি স্ট্রিং পরমের মান পুনরুদ্ধার করতে, আপনি ব্যবহার করতে পারেন

$.url().param('search');

এই লাইব্রেরি সক্রিয়ভাবে রক্ষণাবেক্ষণ করা হয় না। একই প্লাগইনটির লেখকের পরামর্শ অনুসারে আপনি ইউআরআই.জেএস ব্যবহার করতে পারেন ।

অথবা আপনি এর পরিবর্তে js-url ব্যবহার করতে পারেন । এটি নীচের একটির সাথে বেশ মিল।

সুতরাং আপনি পছন্দ মত ক্যোয়ারী অ্যাক্সেস করতে পারেন $.url('?search')


2
খুশী হলাম। কোডটি সর্বজনীন ডোমেনে রয়েছে সুতরাং আপনাকে মন্তব্যগুলি অন্তর্ভুক্ত করতে হবে না।
মুহাদ

4
ভাল সমাধান তবে আপনি যদি ফাইলটির মাধ্যমে পরীক্ষা
নিরীক্ষণ করেন


3
হাই @ kampsj, file://প্রোটোকল দিয়ে পরীক্ষা করার ফলে অনেক বেশি জিনিস কাজ না করার কারণ হবে। আপনি নোড.জেএস দিয়ে খুব দ্রুত এবং সহজ স্ট্যাটিক এইচটিএমএল সার্ভার তৈরি করতে পারেন stackoverflow.com/questions/16333790/…
জেস

2
এই প্লাগইনটি আর রক্ষণাবেক্ষণ করা হয় না এবং লেখক নিজেই এর পরিবর্তে অন্য প্লাগইনগুলি ব্যবহার করার পরামর্শ দিচ্ছেন।
জানারিকগুনার

77

আমাদের বন্ধুদের কাছ থেকে সাইট পয়েন্টে এই রত্নটি খুঁজে পেয়েছি। https://www.sitepPoint.com/url-paraters-jquery/

খাঁটি jQuery ব্যবহার। আমি এটি ব্যবহার করেছি এবং এটি কাজ করেছে। উদাহরণস্বরূপ এটি একটি সামান্য টুইট।

//URL is http://www.example.com/mypage?ref=registration&email=bobo@example.com

$.urlParam = function (name) {
    var results = new RegExp('[\?&]' + name + '=([^&#]*)')
                      .exec(window.location.search);

    return (results !== null) ? results[1] || 0 : false;
}

console.log($.urlParam('ref')); //registration
console.log($.urlParam('email')); //bobo@example.com

আপনি যেমন ব্যবহার করুন।


গ্রেট। ধন্যবাদ! আমি মনে করি না যদিও আপনার শেষ বন্ধ ব্রেস ট্যাগের প্রয়োজন need
bhtabor

আহ্ হ্যাঁ, আপনি ঠিক বলেছেন। পোস্টটি সম্পাদনা করেছেন। এটি আমার কোডে বিবৃতি দেওয়া থেকে কিছু ছেড়ে দেওয়া হয়েছিল। ধন্যবাদ।
ক্লোসডিজাইন

1
আপনার .href এর পরিবর্তে উইন্ডো.লোকেশন.সার্চ ব্যবহার করা উচিত - অন্যথায়, ভাল।
BrainSlugs83

4
পরিবর্তে results[1] || 0, আপনাকে অবশ্যই করতে হবে যদি (ফলাফল) {ফলাফলগুলি ফেরত দেয় [1]} 0 ফেরত; বিসিও কোয়েরি প্যারামিটারগুলি উপস্থিত থাকতে পারে না। এবং সংশোধন সমস্ত জেনেরিক কেস পরিচালনা করবে।
myDoggyWritesCode

1
আপনার মতো কিছু থাকলে আপনি কী করবেন https://example.com/?c=Order+ID? এই প্লাস চিহ্নটি এখনও এই ফাংশনটিতে রয়েছে।
ভোলোমাইক

47

এটি আমার কোডের নমুনা নয়, তবে আমি এটি অতীতে ব্যবহার করেছি।

//First Add this to extend jQuery

    $.extend({
      getUrlVars: function(){
        var vars = [], hash;
        var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
        for(var i = 0; i < hashes.length; i++)
        {
          hash = hashes[i].split('=');
          vars.push(hash[0]);
          vars[hash[0]] = hash[1];
        }
        return vars;
      },
      getUrlVar: function(name){
        return $.getUrlVars()[name];
      }
    });

    //Second call with this:
    // Get object of URL parameters
    var allVars = $.getUrlVars();

    // Getting URL var by its name
    var byName = $.getUrlVar('name');

2
আপনার '=' তে বিভক্ত হওয়া উচিত নয়, কোনও কী / মান জোড়ার মানতে দ্বিতীয় সমান চিহ্ন থাকা প্রযুক্তিগতভাবে ঠিক। - কেবলমাত্র প্রথম সমান চিহ্ন যা আপনার মুখোমুখি হয় (প্রতি কী / মান জুটি) একটি সীমানা হিসাবে বিবেচনা করা উচিত। (এছাড়াও, সমান চিহ্নটি কঠোরভাবে প্রয়োজন হয় না; কোনও মূল্য ছাড়াই একটি কী থাকা সম্ভব))
BrainSlugs83

পরিষ্কার সমাধান। আমার ক্ষেত্রে নিখুঁতভাবে কাজ করেছেন।
জেএফ গ্যাগন

ex। সম্প্রসারিত ({getUrlVars: ফাংশন () {var vars = [], হ্যাশ; var হ্যাশস = উইন্ডো.লোকেশন। রিফ.স্লাইস (উইন্ডো.লোকেশন href.indexOf ('?') + 1) স্প্লিট ('& & '); এর জন্য (var i = 0; i <hashes.length; i++) h hash = hashes [i] .split (' = '); var k = hash.shift (); vars.push (k); vars [কে] = হ্যাশ.জোঁইন ("");} রিটার্ন ওয়ার্স;}, getUrlVar: ফাংশন (নাম) {রিটার্ন $ .getUrlVars () [নাম];}});
মুপিংক

15

আমি একটি সামান্য ফাংশন লিখেছিলাম যেখানে আপনাকে কেবল ক্যোয়ারী প্যারামিটারের নামটি বিশ্লেষণ করতে হবে। সুতরাং যদি আপনার কাছে:? প্রকল্প = 12 এবং মোড = 200 এবং তারিখ = 2013-05-27 এবং আপনি 'মোড' প্যারামিটার চান তবে আপনাকে কেবল 'মোড' নামটি ফাংশনে পার্স করতে হবে:

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

// example caller:
var result =  getParameterByName('Mode');

যদি আপনার নামের কোনও আবর্জনা না থাকে তবে আপনি প্রথম রেইজেক্সটি ড্রপ করতে পারেন এবং এটি অবস্থান থেকে শুরু করার জন্য আরও তাত্পর্যপূর্ণ হবে
অনুসন্ধান করুন

7

উপরের রব নীল্ডের উত্তরে বিল্ডিং, এখানে একটি খাঁটি জেএস অভিযোজন রয়েছে যা ডিকোডেড ক্যোয়ারী স্ট্রিং প্যারামগুলির কোনও সাধারণ অবজেক্ট (% 20 এর নয়) ফিরিয়ে দেয়।

function parseQueryString () {
  var parsedParameters = {},
    uriParameters = location.search.substr(1).split('&');

  for (var i = 0; i < uriParameters.length; i++) {
    var parameter = uriParameters[i].split('=');
    parsedParameters[parameter[0]] = decodeURIComponent(parameter[1]);
  }

  return parsedParameters;
}

আমি এই কোডটি ব্যবহার করে কোনও ত্রুটি দেখিনি। আপনি কোন ব্রাউজার ব্যবহার করছেন? আমি এটি বর্তমান ফায়ারফক্স, ক্রোম এবং সাফারির বিরুদ্ধে পরীক্ষা করেছি।

হ্যাঁ দুঃখিত আমি এটি ভুল পড়েছি। আমি ভেবেছিলাম যে আমি এটি এমন কোনও কিছুর জন্য একটি পদ্ধতি কল করতে দেখেছি যা অপরিজ্ঞাপিত ফিরে আসছে। সুতরাং সত্যিই এটি কেবল একবার চলছে যখন এটি করার দরকার নেই। যখন অনুসন্ধান হয় ""। এবং আপনি {"": "অপরিবর্তিত"}
জেরিনাউ

হ্যাঁ। এটি সম্ভবত কিছু পরিশোধক ব্যবহার করতে পারে।

1

ভ্যানিলা জাভাস্ক্রিপ্ট লিখিত

     //Get URL
     var loc = window.location.href;
     console.log(loc);
     var index = loc.indexOf("?");
     console.log(loc.substr(index+1));
     var splitted = loc.substr(index+1).split('&');
     console.log(splitted);
     var paramObj = [];
     for(var i=0;i<splitted.length;i++){
         var params = splitted[i].split('=');
         var key = params[0];
         var value = params[1];
         var obj = {
             [key] : value
         };
         paramObj.push(obj);
         }
    console.log(paramObj);
    //Loop through paramObj to get all the params in query string.

1
function parseQueryString(queryString) {
    if (!queryString) {
        return false;
    }

    let queries = queryString.split("&"), params = {}, temp;

    for (let i = 0, l = queries.length; i < l; i++) {
        temp = queries[i].split('=');
        if (temp[1] !== '') {
            params[temp[0]] = temp[1];
        }
    }
    return params;
}

আমি এটি ব্যবহার করি

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.