如何将文本转换为输入？

Question

我如何创建诸如以下内容：
- 有一些文字
- 我点击它
- 它转换为包含我单击的文本的输入。

Answer 1

怎么样

像这样的HTML

<div onclick="transform(this)">Some text here</div>

Javascript

function transform(obj)
{
    obj.innerHTML = "<input type='text' value='" + obj.innerHTML + "' />";
}

？希望我正确理解了你的问题。

Answer 2

<a href="#" onclick="var input = document.createElement('input'); input.setAttribute('value', this.firstChild.nodeValue); this.parentNode.replaceChild(input, this);">here is some text</a>. Click it.

您还可以使用 或

代替 ，无论您喜欢什么。

Answer 3

假设 HTML：

<p id='changeMe'>This is some text</p>

您可以使用 jQuery：

$('#changeMe').click(function(){
    $this = $(this)
    $this.replaceWith( $('<input />').val( $this.text() ) )
})

请参阅此处的演示：http://jsfiddle.net/aXZ8e/

Answer 4

<span id="target" onclick="javascript:run();" >This is dummy text</span>

<script type="text/javascript">
function run() {
  var span = document.getElementById( "target" );
  var text = span.innerHTML;
  var input = document.createElement("input");

  input.type = "text";
  input.value = text;

  span.innerHTML = "";
  span.appendChild( input );

  span.onclick = null;
}
</script>