javascriptを使用して文字列をhtmlコンテンツに置き換えます

Question

JSONからこの文字列をレンダリングしました。「私は$ 1 $フロントエンドの開発者です。$ 2 $から$ 3 $」です。

は今、私は、ダイナミックHTMLの入力テキストboxes.Soで$1$,$2$と$3$を交換したい、出力は私がmethod.butがそれを思わ置き換える文字列を使用しようとした

<-input textbox here> frontend developer works at <-input textbox here> from <-input textbox here>.

var str = "I am $1$ frontend developer works at $2$ from $3$"; 
var newStr = ""; 
for(var i=0;i<3;i++){ 
var id = '$'+i+'$'; 
if (str.indexOf(id) >= 0){ 
    newStr = str.replace(id, $.parseHTML('<div><input type="text" 
id="input-"+i/></div>')); 
} 

ていますする必要があります唯一strings.Any他の方法のために動作します私はこの使用したJavaScript/jQueryの

Answer 1

<div id="div1"> 
    </div> 

    <script type="text/javascript"> 
var data = "I am $1$ frontend developer works at $2$ from $3$"; 
    //include jQuery before this code 
     $(function(){ 
     data.replace('$1$','<input type="text" />').replace('$2$','<input type="text" />').replace('$3$','<input type="text" />'); 
     }); 

    $('#div1').html(data); 
    </script> 

Answer 2

var input = "I am $1$ frontend developer works at $2$ from $3$"; 
var result = input.replace(/\$\d\$/g, '<div><input type="text" id="input-"+i/></div>'); 

を達成するために使用することができます

結果は以下のようになります。

I am <div><input type="text" id="input-"+i/></div> frontend developer works at <div><input type="text" id="input-"+i/></div> from <div><input type="text" id="input-"+i/></div> 

私が使用した正規表現は

Answer 3

n0m4d @により投稿されたコメントからであるあなたも、このような何かを試みることができる：

var input = "I am $1$ frontend developer works at $2$ from $3$"; 
var result = replaceWithInputTags(input, '$') 

function replaceWithInputTags(source, templateChar){ 
    var sourceArgs = source.split(templateChar); 

    return sourceArgs.map(function(item){ 
     var index = +item; 
     if (isNaN(index)) return item; 
     return "<input type='text' id='input-" + (index-1) + "' />";  
    }).join(''); 
}