フィールドに挿入されたコンテンツから、テキストエリア内のコードを編集するこの jQuery があります。ここでライブを見ることができます。問題は、ユーザーがフィールドのいずれかに何かを入力しないと、プレースホルダーがコードに挿入されることです。代わりに、フィールドが空のままになっている場合に通常の識別子が置き換えられるのではなく、そこにとどまることを望みます。
ここにjQueryコードがあります。
$(document).ready(function(){
var basicHtml = ($('.code').html()).replace(/</g,'<').replace(/>/g,'>');
$('.code').val(basicHtml);
$('form').on('submit',function() {
var content = basicHtml;
content = content.replace(/%name%/g, ($('#name').val()||$('#name').attr('placeholder')));
content = content.replace(/%slogan%/g, ($('#slogan').val()||$('#slogan').attr('placeholder')));
content = content.replace(/%description%/g, ($('#description').val()||$('#description').attr('placeholder')));
content = content.replace(/%bio%/g, ($('#bio').val()||$('#bio').attr('placeholder')));
content = content.replace(/%analytics%/g, ($('#analytics').val()||$('#analytics').attr('placeholder')));
content = content.replace(/%favicon%/g, ($('#favicon').val()||$('#favicon').attr('placeholder')));
var final = content.replace(/%dribbble_username%/g, ($('#dribbble').val()||$('#dribbble').attr('placeholder')));
$('.code').val(final);
return false;
}).on('reset',function(){
$('form textarea:not(.code),form input').val();
$('.code').val(basicHtml);
});
});
ありがとう!