【问题标题】:change input text field into label with input typed value inside label javascript在标签javascript中使用输入类型值将输入文本字段更改为标签
【发布时间】:2015-10-21 11:41:57
【问题描述】:

我想将文本字段更改为标签标签,其中包含用户输入的文本。我已经尝试并看到了许多正在工作但未将值设置为标签中的文本的示例。例如:

<input id="1" type="text" value="hi"/>

我想用它的innerHTML hi 或用户键入的值替换这个输入文本字段的标签或 div 标签,我尝试了下面的示例,但我没有这样做。

<p id="1" onclick="wish(id)">sasdsad</p>
<script>    
    document.getElementById("1").outerHTML = document.getElementById("1").outerHTML.replace(/p/g,"div");
</scrip>

【问题讨论】:

  • 抱歉有错误 document.getElementById("1").outerHTML = document.getElementById("1").outerHTML.replace(/p/g,"div");
  • 我在jsfiddle.net/s98J5找到了这个例子
  • ID 不能也不应该只是一个数字,它们必须以一些文本标识符开头,例如 &lt;p id="sad1"&gt;sadsad&lt;/p&gt;
  • 是的,它适用于上述示例,但它不适用于解决问题,谢谢
  • 你想要这样的东西吗 - jsfiddle.net/xwszt2s9

标签: javascript jquery html


【解决方案1】:

元素 id 应该以字符而不是数字开头。

使用 jQuery

<input id="one" type="text" value="hi"/>

$('#one').replaceWith("<div>"+$('#one').val()+"</div>");

【讨论】:

    【解决方案2】:

    或者您也可以像这样使用,只是作为替代解决方案:

    html

    <input id="toChange" type="text" value="hi"/>
    <p id="clickMe" onclick="changeTag()">Click Me</p>
    

    jQuery

    function changeTag(){
      var originalForm = $('#toChange');
      var div = $('<div/>',{
                   text : originalForm.val(),
                   id : originalForm.attr('id')
                });
      $('#toChange').replaceWith(div);
    }
    

    DEMO

    【讨论】:

    • 演示链接失效
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-06-27
    • 2020-03-14
    • 1970-01-01
    • 1970-01-01
    • 2019-04-26
    • 1970-01-01
    相关资源
    最近更新 更多