0

JavaScript または jquery を使用して、URL クエリ文字列に基づいてクラスをオブジェクトに追加したいと考えています。

したがって、URLが次の場合example.com/?var=1、オブジェクトに新しいクラスを追加したい #mydiv

?var=2これは、などに対して繰り返さ?var=3れます。

これが私が試したことです。これに対する希望は、クエリ文字列が?var=2または?var=3

var queryString = window.location.search.substr(1); 

switch (queryString) {
    case "2": document.getElementById('mydiv').className = 'newclass2';
;
                   break;
    case "3": document.getElementById('mydiv').className = 'newclass2';
;
                     break;
  }

編集：

それは今ほとんど動作します....

これが私の現在のコードです：

<script>
 var queryString = window.location.search.substr(1);
 var variant = queryString.split('=')[1];
 switch(variant) {
    case "stnl2": document.getElementById('getexclusive-sb').className = 'stnlvar2';
;
break;
    case "stnl3": document.getElementById('getexclusive-sb').className = 'stnlvar3';
;
break;
  }
</script>

URLが「/?v=stnl2」の場合に機能します

ただし、Google コンテンツは「?v=stnl2&utm_expid=42387987-0.dmsadhasjkdjasgdjgas-Q.4」などの URL にさらに追加します。

& とその後のすべての詳細を無視して、コードがまだ機能するようにする方法はありますか?

4

2 に答える 2

0 
var 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];
    }
    if(vars[0] == window.location.href){
        vars =[];
    }
    return vars;
}
var params = getUrlVars();
switch (params['var']){
...
}

params には、クエリ文字列からのすべてのパラメーターが含まれます。変数名を文字列として貼り付けるだけで、そのパラメーターの値が取得されます。

于 2013-10-15T12:59:49.280 に答える
0

試した解決策には 2 つの問題があります。

まず、バリアントの数を間違って取得しています。あなたのコードでは、queryStringのようになります"var=2"。したがって、数値のみが必要な場合は、次のように分割する必要もあります=。

 var queryString = window.location.search.substr(1);
 var variant = queryString.split('=')[1];
 switch(variant) {
     // ...
 }

これはまだ実際にはパラメーターの名前をチェックしないことに注意してくださいvar=。それが唯一のパラメーターである場合、それは機能します。それ以外の場合は、JS でクエリ文字列を適切に処理するために、この質問を見たいと思うかもしれません

第二に、あなたのを注意深く見てくださいswitch。両方のブランチは実際には同一であるため、queryString に関係なくまったく同じことを行います。無意識にコピペしてしまったようです。

更新:

元の回答で述べたように、ソリューションのいくつかの問題とその修正方法を指摘しました。複数のパラメータがある場合は機能しません。もちろん、 の後の文字列はすべて無視できます&。しかし、それでもうまくいかないケースはたくさんあります。パラメータが最初のものではない場合はどうなるでしょうか?

そのような仮定をするのは良い考えではないと思うので、前に言ったことに行き着きます: 適切で本格的なパラメーターの解析が必要になるかもしれません。私が言及したリンクは、この特定のタスクに対して多くのソリューションを提供します。それらのいずれかを選択できます。別のオプションは、そのような機能が提供されている既存のライブラリを使用することです。その質問と他のいくつかのSOの質問は、これら2つを私に指摘しました：

  • jquery.parsequery — この目的専用の jQuery プラグインで、これを使用して実行できますvariant = $.query(location).get("paramName")。古くて更新されていないようです。
  • jsurl — URL を使用してさまざまなことを行うためのライブラリ。特に、それを使用して実行できますvariant = (new Url).query.paramName。

注意：（paramName実際のパラメータ名などに置き換えてvくださいvar）

もちろん、他にも良いライブラリがあるかもしれません。自分でグーグル検索してみてください。

于 2013-10-15T11:09:26.163 に答える