Javascriptコード、終端されていない文字列リテラル

Question

エラーコンソール： 終端されていない文字列リテラル

$html='<li><div class="above">'+$question_number+ 'Question Title</div> 

jQueryのコードは次のとおりです。

$html='<li><div class="above">'+$question_number+ 'Question Title</div> 
<div class="middle"> <input type="text" name="question'+$question_number+ '" size="55"/></div> 
<div class="below">'+$question_number+ ' <input type="text" name="option'+$question_number+ '" size="6"/>'+$question_number+ '<input type="text" name="option'+$question_number+ '" size="6"/> 
    <input class="btn" type="button" name="Submit" value="Add" /> 
    <input class="btn" type="button" name="Submit" value="Remove" /> 
    </div> 
</li>'; 

私は$のHTMLの値は長いですけど、どのように私は逃げることができます「終端文字列リテラル」のトラップ？この問題を回避する方が良いでしょうか？

Answer 1

複数行にわたって文字列リテラルを実行する場合は、行に継続文字が必要です。 "\"文字を各行の末尾に置くか、文字列連結を使用します。言い換えれば、あなたは間違ったを回すことができる：

$html='<li><div class="above">' + $question_number + 'Question Title</div> 
<div class="middle"> ... '; 

へ：

$html='<li><div class="above">' + $question_number + 'Question Title</div>\ 
<div class="middle"> ... '; 

か：

$html='<li><div class="above">' + $question_number + 'Question Title</div>' + 
    ' <div class="middle"> ... '; 

あなたが実際にはきれいにフォーマットされるようにあなたのHTMLを必要としませんが、あなたが実際にあなたがうまく印刷できるような形にしたいのであれば、それにも埋め込み改行を入れることができます：

$html='<li><div class="above">' + $question_number + 'Question Title</div>\n' + 
    '<div class="middle"> ... '; 

コードの読みやすさのために、私のようなものを使用します：

$html = \ 
    '<li>' + 
    ' <div class="above">' + $question_number + 'Question Title</div>' + 
    ' <div class="middle">' + 
    ' <input type="text" name="question' + $question_number+ '" size="55"/>' + 
    ' </div>' + 
    ' <div class="below">' + $question_number + 
    ' <input type="text" name="option' + $question_number + 
    '  " size="6"/>' + $question_number + 
    ' <input type="text" name="option' + $question_number + '" size="6"/>' + 
    ' <input class="btn" type="button" name="Submit" value="Add" />' + 
    ' <input class="btn" type="button" name="Submit" value="Remove" />' + 
    ' </div>' + 
    '</li>'; 

をして、配布のためのはるかに短いバージョンを取得するためにコンプレッサーを通します。

Answer 2

あなたはいつもと同じように複数行にその一部を連結できます。

$html='<li><div class="above">'+$question_number+ 'Question Title</div>'; 
$html+= '<div class="middle"> <input type="text" name="question'+$question_number; 
$html+=' size="55"/></div>'; 

など

Answer 3

あなたのマークアップの断片を格納し、完全なを取得するために参加する方法を使用するように配列を使用することができますマークアップ：

a = new Array(20); 
a[0]='<li><div class="above">' 
a[1]= $question_number 
a[2]= 'Question Title</div>' 
a[3]= '<div class="middle">' 
a[4]= '<input type="text" name="question' 
a[5]= $question_number 
a[6]= '" size="55"/></div>' 
a[7]= '<div class="below">' 
a[8]= $question_number 
a[9]= '<input type="text" name="option' 
a[10]=$question_number 
a[11]= '" size="6"/>' 
a[12]=$question_number 
a[13]='<input type="text" name="option' 
a[14]=$question_number 
a[15]='" size="6"/>' 
a[16]='<input class="btn" type="button" name="Submit" value="Add" />' 
a[17]='<input class="btn" type="button" name="Submit" value="Remove" />' 
a[18]='</div>' 
a[19]='</li>' 

$html = a.join('');