は、入力されたIDのとプレースホルダ

Question

document.getElementById('addplace').addEventListener('click', addplace); 
 

 
j=1; 
 
function addplace() { 
 
    var node = document.createElement("li"); // Create a <li> node 
 
    node.innerHTML = "<input id=''place'+j+' placeholder='+j+' onFocus='geolocate()' type='text' />"    
 
    document.getElementById("waypoints").appendChild(node); 
 
    j++; 
 
}

<ul id="waypoints"></ul> 
 
<input id="addplace" type="submit"/>

の代わりに、私はランニングインデックス1、2、3、などをしたいプレースホルダーとして表示されるテキスト「+ J +」のランニングインデックスを作成するために、innerHTMLプロパティに変数の値を含みます私は究極的には、 "Waypoint 1" "Waypoint 2" "Waypoint 3"のようになりたいと思っています。同様にIDのために、私はそれらを1位、2位、3位などにしたいと思います。私は他の関連する問題を見て+記号を結合することを提案しましたが、このアプリケーションでは動作していないようです。

Answer 1

あなただけの間違った引用符を使用している：これは完全に文字列を連結し、それに応じて番号を挿入します

node.innerHTML = "<input id='place" + j +"' placeholder='" + j + "' onFocus='geolocate()' type='text' />"; 

。ただ、将来のために、ES6は、「テンプレートの文字列」ウィッヒを作成する能力を持っている

EDIT

すべてのブラウザではまだ使用できません：私はあなたに」Sを置く必要があると思う

node.innerHTML = `<input id="place ${j}" placeholder="${j}" onFocus="geolocate()" type="text" />`; 

Answer 2

node.innerHTML = "<input id='place" +j+ "' placeholder='" +j+ "' onFocus='geolocate()' type='text' />" 

Answer 3

これは、あなたの質問への答えではありませんが、を置くことによって、コードを少しきれいにできます。あなたの文字列を終了そのような引数としてイベントハンドラにコールバック関数：この `node.innerHTML = '<入力されたID = "場所 'のよう

document.getElementById('addplace').addEventListener('click', addplace)