フロントエンド開発では、ページングや検索などの特定の操作を実装するために URL にパラメータを追加する必要があることがよくあります。パラメーターを追加すると、バックエンドはパラメーターに基づいて応答できます。この記事ではjQueryを使ってURLにパラメータを追加する方法を紹介します。
jQuery では、$.param()
メソッドを使用してオブジェクトをクエリ文字列に変換し、この文字列を URL の末尾に追加できます。たとえば、JavaScript オブジェクトを宣言できます:
var params = { page: 1, filter: 'recommend', sort: 'desc' };
次に、$.param()
メソッドを使用して、このオブジェクトをクエリ文字列に変換できます:
var qs = $.param(params); console.log(qs); // 'page=1&filter=recommend&sort=desc'
ここで、このクエリ文字列を URL の末尾に追加する必要があります。まず現在の URL を取得し、その末尾にクエリ文字列を追加します。
var currentUrl = window.location.href; var newUrl = currentUrl.indexOf('?') > -1 ? currentUrl + '&' + qs : currentUrl + '?' + qs;
このコードは、まず現在の URL を取得し、次に URL にクエリ文字列が既に含まれているかどうかを確認します。現在の URL にすでにクエリ文字列が含まれている場合は、URL の末尾にある &
記号を使用して新しいクエリ パラメータを追加する必要があります。現在の URL にクエリ文字列がない場合は、 URL の末尾の ?
記号はクエリ パラメータを追加します。
最後に、新しい URL を window.location.href
プロパティに割り当てる必要があります。
window.location.href = newUrl;
このようにして、パラメーターを追加できます。たとえば、Web ページ https://example.com
を開き、次のコードを実行します:
var params = { page: 1, filter: 'recommend', sort: 'desc' }; var qs = $.param(params); var currentUrl = window.location.href; var newUrl = currentUrl.indexOf('?') > -1 ? currentUrl + '&' + qs : currentUrl + '?' + qs; window.location.href = newUrl;
最終的な URL は次のようになります: https://example .com?page=1&filter=recommend&sort=desc
。
概要:
jQuery を使用する場合、$.param()
メソッドを通じて JavaScript オブジェクトをクエリ文字列に変換し、この文字列を At に追加できます。 URL の末尾にパラメータを追加できます。
以上がjQueryを使用してURLにパラメータを追加する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。