生成HTML動態報價時涉及

我有以下腳本：生成HTML動態報價時涉及

function Start() { 

    var TheData = 'tes"sst3\'k'; 

    var TheHTML = '<div class="SomeClass">' + TheData + '</div>'; 
    TheHTML += '<input type="text" id="TheTextBox" value="'; 
    TheHTML += TheData + '" />'; 

    $('#Dynamic').html(TheHTML); 
}

基本上，我動態創建HTML和嵌入一些可變文本到它。問題在於文本包含引號，並且由於引號引起文本框的值與標籤的值不匹配。我該如何解決這個問題？

enter image description here

的的jsfiddle是here。

感謝

來源

2014-01-15 frenchie

你需要逃避你的文字。 – SLaks

問題在於，文本框中的'value'使用雙引號，因此'TheData'中的雙引號結束了'tes'後面的值 – forgivenson

要在屬性中轉義引號，請使用'"'。但如果使用方法來設置值而不是字符串連接，則不需要轉義它。 –

由於您使用而不必擔心逃避串jQuery的，只是這樣做：

$(Start); 
function Start() { 
    var TheData = 'tes"sst3\'k'; 
    var TheHTML = '<div class="SomeClass">' + TheData + '</div>'; 
    TheHTML += '<input type="text" id="TheTextBox" />'; 
    $('#Dynamic').html(TheHTML); 
    $('#TheTextBox').val(TheData); 
}

jsFiddle example

來源

2014-01-15 18:05:00 j08691

好的，謝謝。我認爲這是做到這一點的唯一方法;首先生成空白HTML，將其添加到DOM，然後填寫值。 – frenchie

我有後續jsFiddle：http://jsfiddle.net/wWEC8/2/這是否解決了問題，或者是否存在我沒有想到的邊緣情況？ – frenchie

它是更安全（這個確切原因）讓jQuery擔心所有這些，並生成如下HTML：

var $input = $("<input>").attr("id","TheTextBox").val(TheData); 
var $div = $("<div>").addClass("SomeClass").text(TheData).append($input); 

var $wrapper = $("<div>").append($div); 
var TheHTML = $wrapper.html();

來源

2014-01-15 18:05:56 Greg

僅供參考，您也可以使用此表單創建具有屬性和值的元素：'$（「」，{id：「TheTextBox」，val：TheData}）;''我相信。另外，我最終沒有看到'$ wrapper.html（）'的原因。只要做'$（'＃Dynamic'）。empty（）。append（$ div）'。 –

我有後續jsFiddle：http://jsfiddle.net/wWEC8/2/這是否解決了問題，還是有沒有我沒有想到的邊緣情況？ – frenchie

可以編碼引號，像這樣：

var TheData = 'tes&quot;sst3&apos;k';

來源

2014-01-15 18:06:06 ItsCosmo

這裏是你的答案

$(Start); 

function Start() { 

    var TheData = 'tes"sst3\'k'; 

    var TheHTML = '<div class="SomeClass">' + TheData + '</div>'; 
    TheHTML += '<input type="text" id="TheTextBox" value='; 
    TheHTML += TheData + ' />'; 

    $('#Dynamic').html(TheHTML); 
}

來源

2014-01-15 18:12:09

生成HTML動態報價時涉及

回答

相關問題