如何在jQuery中使用占位符？

我想创建一个文本模板并在其中设置占位符并填充此占位符并在我的页面中使用它？如..如何在jQuery中使用占位符？

var temp = '<div class="persons">'; 
temp += '<p> <span class="firstname">First Name :</span> <span> [firstname]</span> </p>'; 
temp += '<p> <span class="lastname">Last Name :</span> <span> [lastname]</span> </p>'; 
temp += '<p> <span class="tel">Telephone :</span> <span> [tel]</span> </p>'; 
temp += '</div>';

，改变[firstname]，[lastname]，[tel]与我的页面值并且显示？或任何其他想法？

来源

2012-04-25 AmirHossein

你有什么尝试？另外，你应该看看现有的JS模板引擎。 – 2012-04-25 20:48:32

请详细解释。 – AmirHossein 2012-04-25 20:49:59

使用sprintf /格式类型的函数：看到这里http://stackoverflow.com/questions/610406/javascript-equivalent-to-printf-string-format/4673436#4673436 – 2012-04-25 20:54:08

你试过.replace()？

http://jsfiddle.net/KL9kz/

来源

2012-04-25 20:53:30 yoshi

谢谢很多;-) – AmirHossein 2012-04-25 21:26:51

您可以简单地替换它们。

temp.replace("[firstname]", "fred").replace("[lastname]", "smith").replace("[tel]", "123456789");

不确定您是否使用jQuery模板。

来源

2012-04-25 20:50:08 locrizak

不工作！我使用jQuery 1.71 – AmirHossein 2012-04-25 20:53:38

快速&脏JS模板引擎：

// Create a matching object for each of your replacement 
var matches = { 
    "[firstname]": "fred", 
    "[lastname]": "smith", 
    "[tel]": "123456789" 
} 

// Loop through the keys of the object 
Object.keys(matches).forEach(function(key) { 
    // Replace every key with its value 
    temp = temp.replace(key, matches[ key ]) 
})

来源

2012-04-25 20:55:25

我真的很喜欢'Object.keys（）'。以前不知道。但是为了有一个影响，你必须存储来自'replace（）'的结果，因为它不在对象本身上运行。看到这里：http://jsfiddle.net/6vxKB/1/ – yoshi 2012-04-26 08:32:43

糟糕，我的坏，我正在编辑工作的解决方案:)。请注意'Object.keys'，因为它不是跨浏览器，尽管填充它只是[几行]的问题（https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/keys）（ 'forEach'也一样）。 – 2012-04-26 08:36:14

尝试这样的事情，非常基本的

function replaceall(tpl, o, _p, p_) { 
    var pre = _p || '%', 
     post = p_ || '%', 
     reg = new RegExp(pre + '([A-z0-9]*)' + post, 'g'), 
     str; 
    return tpl.replace(reg, function (str, $1) { 
     return o[$1]; 
    }); 
}; 
var temp = '<div class="persons">'+ 
     '<p> <span class="firstname">First Name :</span> <span> [firstname]</span> </p>'+ 
     '<p> <span class="lastname">Last Name :</span> <span> [lastname]</span> </p>'+ 
     '<p> <span class="tel">Telephone :</span> <span> [tel]</span> </p>'+ 
    '</div>', 
    data = { 
     'firstname':'Fede', 
     'lastname':'Ghe', 
     'tel' : '+00 012 3456789' 
    }; 
alert(replaceall(temp, data, '\\\[', '\\\]'));

是cafeful逃脱占位符界限，如果需要调整内部正则表达式希望它有帮助

来源

2012-09-12 12:09:53 fedeghe

回答

相关问题