在“编辑”页面上,不要以常规方式(带有标签)包括CSS,而是将其全部写入
p {
color: #f0f;
}
Preview
使用jQuery的Javascript:
jQuery(function($) {
var $ed = $('#editor')
, $style = $('#styles')
, $button = $('#preview')
;
$ed.val($style.html());
$button.click(function() {
$style.html($ed.val());
return false;
});
});
就是这样!
如果您真的想花哨的话,请将功能附加到textarea上的keydown上,尽管您可能会得到一些不良的副作用(键入时页面会不断变化)
编辑:经过测试并且可以工作(至少在Firefox 3.5中,尽管在其他浏览器上应该可以)。在此处查看演示:http : //jsbin.com/owapi