URLエンコードなしで$.paramメソッドを使用する方法-フロントエンドQ&A-php.cn

URLエンコードなしで$.paramメソッドを使用する方法

PHPz

リリース： 2023-04-17 15:15:07

オリジナル

816 人が閲覧しました

jQuery の Ajax リクエストを使用する場合、データ送信を容易にするために $.param メソッドを使用してオブジェクトをクエリ文字列にシリアル化することがよくあります。 $.param メソッドは、データを自動的に URL エンコードします (たとえば、スペースを .param に変換します)。ただし、場合によっては、URL エンコードを行わずにオブジェクトをシリアル化し、そのまま保持したい場合があります。この記事では、URLエンコードを行わずに$.paramメソッドを使用する方法を紹介します。

まず、$.param メソッドの基本的な使い方を見てみましょう。次のオブジェクトがあるとします。

var data = {
  name: 'John Doe',
  age: 30,
  company: 'ABC Inc.',
  address: {
    street: '123 Main St',
    city: 'Anytown',
    state: 'CA',
    zip: '12345'
  }
};

ログイン後にコピー

以下に示すように、$.param メソッドを使用してクエリ文字列にシリアル化できます。

var queryString = $.param(data);

// queryString 的值为：
// "name=John%20Doe&age=30&company=ABC%20Inc.&address%5Bstreet%5D=123%20Main%20St&address%5Bcity%5D=Anytown&address%5Bstate%5D=CA&address%5Bzip%5D=12345"

ログイン後にコピー

ご覧のとおり、$.paramメソッドはオブジェクトをシリアル化します。 URL はエンコードされ、スペースはに変換され、一部の特殊文字はエンコードされます。オリジナルの外観を維持したい場合は、ちょっとしたトリックを使用する必要があります。

まず、次のように、URL エンコードを実行しない関数を定義する必要があります。

function serializeParam(obj) {
  var str = [];
  for (var p in obj) {
    if (obj.hasOwnProperty(p)) {
      str.push(encodeURIComponent(p) + '=' + obj[p]);
    }
  }
  return str.join('&');
}

ログイン後にコピー

この関数の機能は、オブジェクトを文字列に変換することであり、URL は実行されません。エンコーディング。次に、この関数を使用して、以下に示すように、オブジェクトをクエリ文字列にシリアル化できます。

var queryString = Object.keys(data).map(function(key) {
  var value = data[key];
  if (typeof value === 'object') {
    value = serializeParam(value).replace(/%20/g, '+');
  }
  return encodeURIComponent(key) + '=' + value;
}).join('&');

// queryString 的值为：
// "name=John Doe&age=30&company=ABC Inc.&address[street]=123 Main St&address[city]=Anytown&address[state]=CA&address[zip]=12345"

ログイン後にコピー

ご覧のとおり、このメソッドによって生成されたクエリ文字列は URL エンコードされていませんが、スペースは置き換えられます。プラスになりました。したがって、データを受信するサーバーがこの送信方法をサポートしている場合は、この方法を使用できます。

要約すると、カスタム関数を使用すると、特別なニーズを満たすために、URL エンコードを行わずに jQuery でオブジェクトをシリアル化できます。

以上がURLエンコードなしで$.paramメソッドを使用する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。