使用javascript替换字符串到html内容

Question

我有这个字符串从JSON呈现“我是$ 1 $前端开发人员在$ 2 $从$ 3 $开始工作”。

现在，我想通过动态HTML输入文本boxes.So更换$1$,$2$和$3$，输出应该是我

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

我试图用字符串替换method.but看来，这只能用于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> 

我用正则表达式是由@张贴n0m4d

Answer 3

注释您也可以尝试这样的事：

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