未在追加HTML中創建正斜線（'/'） - .append（）

Question

我試圖將HTML部分追加到「alert」框中，除了附加HTML中的URL外，這是我使用jQuery附加的HTML代碼。

var html = "Please follow the template provided into sample file and try again."; 
html += '<span onclick="window.location="\Static\SampleQuote.xlsx"> Click Here </span>To Download'; 
loadAlertPopupHTML("FAILED","Excel file parsing failed.",html); 

我試圖與這answer的幫助，但我仍然沒有得到確切的語法。

我嘗試每一種：

html += '<span onclick="window.location="\\Static\\SampleQuote.xlsx"> Click Here </span>'; 

html += '<span onclick="window.location=""/" \Static\SampleQuote.xlsx "/"> 
Click Here </span>'; 

html += '<span onclick="window.location="\Static\SampleQuote.xlsx"> 
Click Here </span>'; 

但輸出將是無斜線相同（/）：

<span onclick="window.location=" staticsamplequote.xlsx"=""> Click Here </span> 

您也可以嘗試在這裏作爲一個例子：https://jsfiddle.net/smit_patel/exz6d1t3

Answer 1

問題是由於不匹配的報價都包裹在onclick屬性和window.location分配。您需要在window.location作業中使用轉義的單引號，並且還要跳過斜線。試試這個：

var html = "Please follow the template provided into sample file and try again. <br /><br />"; 
 
html += '<strong><span onclick="window.location=\'\\Static\\SampleQuote.xlsx\'" class="fa fa-download" style="color:#0055a5; font-size:15px; cursor:pointer;" title="Click to Download Sample Template"> Click Here </span> to download excel template Employee Census Form.</strong>'; 
 
$("#test").append(html);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="test"></div>

更妙的是，只需使用標準<a />元素，因爲它有沒有誰已禁用JS用戶的弊端相同的行爲，而且是更容易獲得。

var html = "Please follow the template provided into sample file and try again. <br /><br />"; 
html += '<strong><a href="\Static\SampleQuote.xlsx" class="fa fa-download" title="Click to Download Sample Template">Click Here</a> to download excel template Employee Census Form.</strong>'; 
$("#test").append(html); 

Answer 2

在js「\」用於轉義序列。 所以用這樣的

onclick="window.location="\\Static\\SampleQuote.xlsx" 

Answer 3

我已經改變了你的jsfiddle，就像下面和它的工作。

$("#test").append("Please follow the template provided into sample file and try again. <br /><br />"); 
$("#test").append('<strong><span onclick=window.location="/\Static/\SampleQuote.xlsx" class="fa fa-download" style="color:#0055a5; font-size:15px; cursor:pointer;" title="Click to Download Sample Template"> Click Here </span> to download excel template Employee Census Form.</strong>'); 
$("#test").append(html);