jQueryスクリプトでのHTML-in-string/html（）の回避

Question

javascriptを使用して自分のサイトのjQueryベースのカスタムポップアップウィンドウを作成したいとします。

私はjavascriptの文字列変数内のポップアップに移動して、これその文字列を表示するには、HTMLを格納することによって、それを試作：

stringがこのように定義されて

$('#pop_div').html(string); 

：

var string= '<div class="className">' + 
    'HTML Content'+ 
'</div>' 

私は」これを行ういくつかのウェブサイトを見たが、間違っていると思う。

それは、静的なHTMLスニペットのために動作しますが、レールのため<% = ..％>

を使用してHTMLを生成しないのJavaScript/jQueryのスクリプトにレールによって生成されたロードHTMLコードの最良の方法は何ですか？

おかげ

Answer 1

escape_javascriptは、元の文字列ではJavaScriptインタプリタによって適切に解釈されることを保証する作業を行いますので、

<script>var string = <%= escape_javascript(...) =>;</script> 

を行うには罰金です。

詳細は、Why escape_javascript before rendering a partial?を参照してください。

<script>要素の代わりにonclickハンドラに配置する場合は、escape_javascriptにしてからHTMLをエスケープすることに注意してください。

Answer 2

変数の要素を格納するために容易になるだろう：

var el = $("<div class='className' />").html("HTML Content"); 

//append the element to the div 
$("#pop_div").append(el); 

Answer 3

3つの段階にいかが：

今

var htmlContent = 'HTML Content'; 

var elem = $('<div />').addClass("className").html(htmlContent); 

$('#pop_div').empty().append(elem); 

、私はRoRのとの "Hello World" をやりました、 Mike Samuelのescape_javascriptコードを使用してください。