將Textarea文本設置爲正確格式化的HTML代碼與jQuery

我想通過Javascript（jQuery）爲我的Textarea生成文本，因爲我在JS中需要包含一個變量。這就是我現在要做的：將Textarea文本設置爲正確格式化的HTML代碼與jQuery

$("#txt_banner1").text(
      '<a href="'+producturl+'"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="125" height="125"><param name="movie" value="../../images/banerxsky2.swf" /><param name="quality" value="high" /><embed src="http://www.xSkySoftware.com/images/banerxsky2.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="125" height="125"></embed></object>')

現在你可能會想：「老兄，格式化你的代碼」。嗯，這就是問題 - 我希望我的textarea包含我的HTML代碼正確格式，但是當我在參數中格式化我的代碼時，它不會工作（腳本停止）。

有什麼建議嗎？

編輯：格式化代碼，這是行不通的：

 $("#txt_banner1").text(
     '<a href="'+producturl+'"> 
     <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="125" height="125"> 
     <param name="movie" value="../../images/banerxsky2.swf" /> 
     <param name="quality" value="high" /> 
     <embed src="http://www.xSkySoftware.com/images/banerxsky2.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="125" height="125"> 
     </embed> 
     </object>');

EDIT2：這裏是我的textarea的代碼：

<textarea id="txt_banner1"><a href="AFF_URL"> 
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="125" height="125"> 
    <param name="movie" value="http://xSkySoftware.com//images/banerxsky2.swf" /> 
    <param name="quality" value="high" /> 
    <embed src="http://www.xSkySoftware.com/images/banerxsky2.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="125" height="125"></embed> 
    </object> 
</textarea>

來源

2011-05-31 Jeff

如果您添加非工作格式的代碼可能會有幫助 - 有人可以告訴您爲什麼它不起作用。 – 2011-05-31 16:07:16

你能否在字符串中加入「\ r \ n」序列來引入換行符？（簡單的「\ n」也可能工作。） – Pointy 2011-05-31 16:08:29

@Thom - 包括:) – Jeff 2011-05-31 16:56:11

你可以設置你的txt_banner1的價值事前，以及剛剛更換劇本中的產品：

<div id="txt_banner1"><a href='MY_NEW_URL'><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="125" height="125"><param name="movie" value="../../images/banerxsky2.swf" /><param name="quality" value="high" /><embed src="http://www.xSkySoftware.com/images/banerxsky2.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="125" height="125"></embed></object>

腳本：

var text = $("#txt_banner1").text(); 
$("#txt_banner1").text(text.replace("MY_NEW_URL", producturl);

來源

2011-05-31 16:10:31

當然，這樣你可以用任何你喜歡的方式格式化你的html。 – 2011-05-31 16:11:12

嗯，它似乎不會編譯。 – Jeff 2011-05-31 16:24:55

@Niklas - 這是我的JS：'$（「＃txt_banner1」）。text.replace（「AFF_URL」，producturl）;' - 我注意到你也是不正確的，缺少圓括號：P – Jeff 2011-05-31 16:27:46

我會建議你使用，也就是說，一個隱藏<div>元素把鏈接標記在頁面本身：

<div id="content" style="display: none;"><a href="#"> 
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
      codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" 
      width="125" height="125"> 
     <param name="movie" value="../../images/banerxsky2.swf" /> 
     <param name="quality" value="high" /> 
     <embed src="http://www.xSkySoftware.com/images/banerxsky2.swf" 
       quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" 
       type="application/x-shockwave-flash" width="125" height="125" /> 
    </object> 
</a></div>

然後，您可以使用jQuery克隆鏈接，修改其href屬性上飛和使用產生的標記來填充您<textarea>元素：

var $content = $("#content").clone(); 
$content.children("a").attr("href", producturl); 
$("#txt_banner1").val($content.html());

編輯：對於稍微調整了標記結果。小提琴可用here。

來源

2011-05-31 16:15:38

您可以將HTML剪斷在一個隱藏的容器在頁面上並格式化你喜歡的方式：

風格：

#html_codez { display: none }

標記：

<div id="html_codez"> 
    <a href="{producturl}"> 
     <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
      codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" 
      width="125" height="125"><param name="movie" value="../../images/banerxsky2.swf" /> 
      <param name="quality" value="high" /> 
      <embed src="http://www.xSkySoftware.com/images/banerxsky2.swf" 
       quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" 
       type="application/x-shockwave-flash" width="125" height="125"> 
      </embed> 
     </object> 
    </a> 
</div>

（注關閉</a>，你錯過了。）

然後，抓住它通過innerHTML，它在大多數瀏覽器中被歸一化爲緊湊的HTML。如果它不在特定的瀏覽器上，您仍然可以使用一些正則表達式替換來清理標籤之間的空白區域。在Chrome，你還是要修剪開頭和結尾的空白：

var code = $.trim($("#html_codez").html());

然後你就可以把這個您的textarea裏面：

$("#txt_banner1").val(code.replace("{producturl}", producturl));

來源

2011-05-31 16:16:23

的嘲笑答案是「你這樣做是錯誤的「。別擔心，這是一個簡單的解決方法。

JavaScript不允許多行字符串。你可以寫：

"foo bar\nbaz"

但不

"foo bar 
baz"

除非轉義字符換行（這不是ECMA規格的一部分，但所有的瀏覽器我測試過支持這一）

"foo bar\ 
baz"

執行多行字符串的「正確」方法是將新行字符添加到字符串，但可以使用更多引號模擬新行：

"foo bar\n"+ 
"baz"

是的，它很爛，但是你有它。

來源

2011-05-31 16:21:55 zzzzBov

+1爲正確答案，爲什麼它不工作，即「JavaScript不允許多行字符串」。我不會推薦這個解決方案，因爲與其他解決方案相比，它有點難看，但它是準確的。 – Davy8 2011-05-31 16:37:27

將Textarea文本設置爲正確格式化的HTML代碼與jQuery

回答

相關問題