jquery - change input text field into label with input typed value inside label javascript - Stack Overflow

admin管理员组

文章数量:1320661

I want to change the text field into a label tag with input user typed text inside it. I have tried and seen many example which are working but not set value as a text in label. e.g.:

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

I want to replace this input text field with label or div tag with its innerHTML hi or the user typed value i have tried the example below but i it is not done by me.

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

I want to change the text field into a label tag with input user typed text inside it. I have tried and seen many example which are working but not set value as a text in label. e.g.:

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

I want to replace this input text field with label or div tag with its innerHTML hi or the user typed value i have tried the example below but i it is not done by me.

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

• javascript
• jquery
• html

Share Improve this question Follow edited Jul 30, 2015 at 8:17 asked Jul 30, 2015 at 8:04 user3857603user3857603 6

• Sorry For Mistake document.getElementById("1").outerHTML = document.getElementById("1").outerHTML.replace(/p/g,"div"); – user3857603 Commented Jul 30, 2015 at 8:07
• i found this example in jsfiddle/s98J5 – user3857603 Commented Jul 30, 2015 at 8:08
• ID's cannot and should not just be a number, they must start with some text identifier such as <p id="sad1">sadsad</p> – Jamie Barker Commented Jul 30, 2015 at 8:12
• yes it is working for the above example but it doesnot work for problem thanks – user3857603 Commented Jul 30, 2015 at 8:14
• do you want something like this - jsfiddle/xwszt2s9 – Rohit Kumar Commented Jul 30, 2015 at 8:20

 |  Show 1 more ment

2 Answers 2

Sorted by: Reset to default 5

Element id should start with character not number.

With using jQuery

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

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

Or you can use like this as well, just for an alternative solution :

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

本文标签： jquerychange input text field into label with input typed value inside label javascriptStack Overflow