Warum überspringt jQuery den Code, wenn '&' in der Zeichenfolge steht

Question

Ich versuche eine mailto-Schaltfläche zu erstellen, in der der Titel und der Text einer E-Mail erstellt wird.

Mein Code macht seinen Job richtig, aber ich erkannte, wenn der Buchstabe '&' im Text ist, dann wird der Rest des Codes übersprungen. Die Zeichenfolge ist also sichtbar bis '&', und alles andere wird nicht in den E-Mail-Text eingefügt.

Werfen Sie einen Blick ein Beispiel: jsFiddle

var title = "my track title"; 
 
var artist= "ArtistA & Artist B"; 
 
var trackURL= " http://localhost/music"; 
 

 

 
var subjectText = title + " by " + artist; 
 
var bodyText = "Check out the track " + title + " by " + artist + " on " + trackURL; 
 

 
var url = 'mailto:' + '' + '?subject=' + subjectText + '&body=' + bodyText; 
 
$(".email").on("click tap", function(event) { 
 
    event.preventDefault(); 
 
    window.location = url; 
 
}); 
 
console.log(url);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button class="email">Send Email</button>

In der Konsole wird es korrekt angezeigt, aber wenn Sie pres die Taste und öffnen Sie die es in einer E-Mail-Anwendung Sie sehen, dass die Text ist wie: Check out the track my track title by ArtistA und der Rest fehlt.

Wenn ich ‚&‘ zu ändern ‚und‘ es funktioniert einwandfrei und zeigt: Check out the track my track title by ArtistA and Artist B on http:/localhost/music

Jede Idee, wie man es beheben? Ich habe versucht .toString(), aber hat nicht funktioniert.

Answer 1

Das liegt daran, & ist das Trennzeichen der URL-Parameter.

Sie müssen Sie Werte kodieren (encodeURIComponent für die Texte und encodeURI für die URL), bevor sie in die URL-Zeichenfolge hinzufügen.

var title ="my track title"; 
     var artist= "ArtistA & Artist B"; 
     var trackURL= " http://localhost/music"; 


     var subjectText = encodeURIComponent(title + " by " + artist); 
     var bodyText = encodeURIComponent("Check out the track " + title + " by " + artist + " on ") + encodeURI(trackURL); 

     var url = 'mailto:' + '' + '?subject=' + subjectText + '&body=' + bodyText; 
     $(".email").on("click tap", function(event) { 
      event.preventDefault(); 
      window.location = url; 
     }); 
     console.log(url);