kod Javascript, niezakończony ciąg dosłowne konsola

Question

Błąd: niezakończony ciąg dosłowne

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

Kod jQuery jest:

$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>'; 

Znam wartość $ html jest długa, ale jak mogę uciec pułapka "nieokreślonego dosłownego ciągu literowego"? Czy istnieje lepszy sposób obejścia tego problemu?

Answer 1

Twoje linie wymagają znaku kontynuacji, jeśli zamierzasz używać literałów ciągu w wielu liniach. Umieść znak "\" na końcu każdej linii lub użyj łączenia ciągów. Innymi słowy, można włączyć nieprawidłowy:

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

do:

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

czyli

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

zrobić nie faktycznie potrzeba Twój HTML być ładnie sformatowany ale , jeśli naprawdę chcesz go w formie, którą możesz ładnie wydrukować, możesz umieścić w nim także wbudowane znaki nowej linii:

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

Dla czytelności kodu, chciałbym użyć czegoś takiego:

$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>'; 

a następnie przekazać go przez sprężarkę, aby uzyskać znacznie krótszą wersję dystrybucji.

Answer 2

Zawsze można po prostu złączyć jego części na wielu liniach jak:

$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>'; 

itp

Answer 3

Można użyć tablic do przechowywania fragmentów znaczników, a następnie użyć metody join, aby uzyskać kompletny znacznik:

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('');