2
根据this JSFIDDLE发现在this SO answer我基本上试图达到相同的,但是,我的元素不是div
或不能只是一个<p>
标记,基本上可以是任何元素,而下面的代码假设它会是一个<p>
标签如何将单击的元素转换为textarea并返回?
我怎样才能让它回到原来的元素?
HTML
<p>If no background color...</p>
<span>Element shortcut method for ...</span>
<i>Element shortcut method which ...</i>
JS
$(".modal-body div *").on("click", function(){
divClicked();
});
function divClicked() {
var divHtml = $(this).html();
var editableText = $("<textarea />");
editableText.val(divHtml);
$(this).replaceWith(editableText);
editableText.focus();
// setup the blur event for this new textarea
editableText.blur(editableTextBlurred);
}
function editableTextBlurred() {
var html = $(this).val();
var viewableText = $("<p>"); <-- Could have been another tag
viewableText.html(html);
$(this).replaceWith(viewableText);
// setup the click event for this new div
viewableText.click(divClicked);
}
很好,因为我不知道,我们可以设置该属性 –