Caractère esperluette (&) dans une valeur de l’option de données de demande jQuery AJAX

J’exécute des requêtes HTTP asynchrones (Ajax) via jQuery avec la base $ .ajax (). Le code ressemble à ceci:

$("textarea").blur(function(){ var thisId = $(this).attr("id"); var thisValue = $(this).val(); $.ajax({ type: "POST", url: "some.php", data: "id=" + thisId + "&value=" + thisValue, success: function(){ alert( "Saved successfully!" ); } }); });

Tout fonctionne normalement, jusqu’à ce que l’utilisateur tape à l’intérieur du caractère textarea esperluette (&). Que lorsque je débogue la fonction PHP, ce qui enregistre la valeur, il a toujours une valeur jusqu’à ce caractère.

Je crois qu’il doit y avoir une solution pour ignorer esperluette (&) en quelque sorte. Des idées?

Au lieu de:

 data: "id=" + thisId + "&value=" + thisValue

faire:

 data: { id: thisId, value: thisValue }

De cette façon, jQuery s’occupera de coder correctement les valeurs par URL. Les concaténations de chaînes sont la racine de tous les maux 🙂

Nous vous recommandons vivement d’utiliser la solution fournie par Darin ci-dessus si possible; De cette façon, vous pourrez réutiliser du code bien testé pour créer des données POST .

Mais si vous devez vraiment, vraiment, vraiment utiliser la concaténation de chaînes (ici ou ailleurs dans votre application lors de la création de chaînes de requête ou de données POST sur des entrées utilisateur), vous devez utiliser encodeURIComponent :

 $("textarea").blur(function(){ var thisId = $(this).attr("id"); var thisValue = $(this).val(); $.ajax({ type: "POST", url: "some.php", data: "id=" + encodeURIComponent(thisId) + "&value=" + encodeURIComponent(thisValue), success: function(){ alert( "Saved successfully!" ); } }); });

Par défaut, lorsque vous envoyez un POST avec jQuery.ajax , vous envoyez des données avec le type de contenu application/x-www-form-urlencoded , ce qui signifie que vous promettez que les données sont codées de cette façon. Vous devez être sûr de garder votre part du marché et de l’encoder réellement. Ce n’est pas seulement important pour les esperluettes.

utilisez simplement la fonction javascript encodeURIComponent() :

 $("textarea").blur(function(){ var thisId = $(this).attr("id"); var thisValue = $(this).val(); $.ajax({ type: "POST", url: "some.php", data: "id=" + thisId + "&value=" + encodeURIComponent(thisValue), success: function(){ alert( "Saved successfully!" ); } }); });

 $.ajax({ type:'POST', dataType: "text", url:'save.php', data:'_id='+$('#id').val()+'&title='+$('#title').val(), ?? data: { id: thisId, value: thisValue }