CODEWITHSUNDEEP
javascriptjqueryhtml
user3857603
user3857603

Reputation:

change input text field into label with input typed value inside label javascript

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>

Upvotes: 5

Views: 10165

Answers (2)

Norlihazmey Ghazali
Norlihazmey Ghazali

Reputation: 9060

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

Upvotes: 0

Aravinder
Aravinder

Reputation: 503

Element id should start with character not number.

With using jQuery

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

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

Upvotes: 5

Related Questions