Vibhu Mishra
Vibhu Mishra

Reputation: 29

Replacing text on webpage

I want to take input of text by user which will replace a written text on webpage. just think i have a name in html, i have made form in which type his name and press (okay) after this, the name in tag replace by the name input by user and I have styled text by CSS written in tag.

Upvotes: 0

Views: 83

Answers (1)

happymacarts
happymacarts

Reputation: 2595

//make sure the DOM is finished loading then execute our script
//by putting it in a ready function

$(document).ready(function() {
  $('.ok').click(function(e) {
    $('#result').addClass('sent'); // add styles to the submitted content
    var nameVal = $('#nameField').val(); // get value in form field

    //set the value of your div to form value
    $('#result').addClass('sent').html(nameVal);
  })

})
.sent {
// add custom styles here
   color:red;

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input type="text" class="form-control" id="nameField" placeholder="Jane Doe">
  <input class="ok" type="button" value="Ok">
</form>




<div id="result">Value will be here</div>

Upvotes: 1

Related Questions