web-dev-qa-db-ja.com

URLに追加してページを更新

現在のURLにパラメーターを追加し、ページを更新するjavascriptの一部を作成しようとしています-これを行うにはどうすればよいですか？

javascriptjqueryrefresh
112
amateur

これは動作するはずです（テストされていません！）

var url = window.location.href;    
if (url.indexOf('?') > -1){
   url += '&param=1'
}else{
   url += '?param=1'
}
window.location.href = url;
144
Shlomi Komemi

受け入れられた答えよりも短く、同じことをしますが、シンプルに保ちます：

window.location.search += '&param=42';

Url全体を変更する必要はなく、locationのsearch属性として知られるクエリ文字列のみを変更する必要があります。

検索属性に値を割り当てると、疑問符がブラウザーによって自動的に挿入され、ページが再ロードされます。

120
Bo Frederiksen

ここでの回答のほとんどは、URLにパラメーターを追加する必要があることを示唆しています。これは、次のスニペットまたは同様のバリエーションのようなものです。

location.href = location.href + "&parameter=" + value;

ほとんどの場合、これは非常にうまく機能します。

ただし、

私の意見では、これはパラメーターをURLに追加する正しい方法ではありません。

推奨されるアプローチでは、パラメーターがURLに既に設定されているかどうかをテストしないため、注意しないと、同じパラメーターが複数回繰り返される非常に長いURLになる可能性があります。すなわち：

https://stackoverflow.com/?&param=1&param=1&param=1&param=1&param=1&param=1&param=1&param=1&param=1

この時点で問題が始まります。推奨されるアプローチは、複数のページの更新後に非常に長いURLを作成する可能性があるため、URLが無効になります。長いURLの詳細については、このリンクを参照してください 異なるブラウザーでのURLの最大長は？

これは私の提案されたアプローチです：

function URL_add_parameter(url, param, value){
    var hash       = {};
    var parser     = document.createElement('a');

    parser.href    = url;

    var parameters = parser.search.split(/\?|&/);

    for(var i=0; i < parameters.length; i++) {
        if(!parameters[i])
            continue;

        var ary      = parameters[i].split('=');
        hash[ary[0]] = ary[1];
    }

    hash[param] = value;

    var list = [];  
    Object.keys(hash).forEach(function (key) {
        list.Push(key + '=' + hash[key]);
    });

    parser.search = '?' + list.join('&');
    return parser.href;
}

この機能を使用すると、次のことを行う必要があります。

location.href = URL_add_parameter(location.href, 'param', 'value');
62
yeyo
function gotoItem( item ){
    var url = window.location.href;
    var separator = (url.indexOf('?') > -1) ? "&" : "?";
    var qs = "item=" + encodeURIComponent(item);
    window.location.href = url + separator + qs;
}

より互換性のあるバージョン

function gotoItem( item ){
    var url = window.location.href;    
    url += (url.indexOf('?') > -1)?"&":"?" + "item=" + encodeURIComponent(item);
    window.location.href = url;
}
2
epascarello
location.href = location.href + "&parameter=" + value;
2
Paul Alexander

上記の@yeyoの思慮深い答えに対する1つの小さなバグ修正。

変化する：

var parameters = parser.search.split(/\?|&/);

に：

var parameters = parser.search.split(/\?|&amp;/);

0
Gabrien

以下のコードを確認してください：

/*Get current URL*/    
var _url = location.href; 
/*Check if the url already contains ?, if yes append the parameter, else add the parameter*/
_url = ( _url.indexOf('?') !== -1 ) ? _url+'&param='+value : _url+'?param='+value;
/*reload the page */
window.location.href = _url;
0
Aftab

これを試して

var url = ApiUrl(`/customers`);
  if(data){
   url += '?search='+data; 
  }
  else
  { 
      url +=  `?page=${page}&per_page=${perpage}`;
  }
  console.log(url);
0
Atchutha rama reddy Karri