Javascript：不足）ボタンを返す際に引数エラーが発生しました

Question

UIのある機能でボタンを返していて、wierdエラーが発生しようとしています。誰かが助けてくれますか？私が手

var div = "<button onclick='javascript:displayDetails('+value1+','+value2+');'>View</button>" 

エラーは次のとおりです。

欠落）引数リストの後に。

Answer 1

あなたはエスケープする必要があります。

var div = "<button onclick=\"javascript:displayDetails('+value1+','+value2+');\">View</button>" 

Answer 2

onclick="javascript:displayDetails('+value1+','+value2+');" 

をしない "" ネストされた避けるために、代わりに 'の複数行をサポートしてい

onclick='javascript:displayDetails('+value1+','+value2+');' 

---

使用 ``：

const div = ` 
    <button onclick="javascript:displayDetails('+value1+','+value2+');"> 
     View 
    </button>`; 

ない

その後

const div = "<button onclick='javascript:displayDetails('+value1+','+value2+');'>View</button>" 

あなたは

Answer 3

（以前もES6として知られている/ ES2015、）はJavaScriptの最新バージョンをエスパスする必要はありません、今のちょうどこの種のを避けるのを助けることができる「テンプレート文字列」をサポートしています引用/脱出の悪夢。一般的に

var div = `<button onclick="javascript:displayDetails(${value1},${value2});">View</button>`; 

：あなたがしたいテンプレート文字列、および各値について${value}のテンプレート構文を通知するために、文字列の周りに「バッククォート引用」（別名墓のアクセント）を使用して文字列に（付属）、「補間」どの引用符をいつ使うのかを決める基準を選ぶのが最善です。多くの現代のJavaScriptスタイルガイドでは、通常の文字列の場合は一重引用符（'）を使用し、周囲のHTML（またはXML）属性の場合は二重引用符（"）を使用します。今や第3の引用機構を持つことで、バックスラッシュエスケープ記号を頻繁にエスケープする必要がないことを意味します。エスケープするのは迷惑で、エラーが発生しやすく、透明性が低いからです。