javascript - Jquery change label text with inner input -


i novice in jquery. want change label text when input box changed. have input box name email.

<input type="text" name="email" id="email" /> 

when input box changed want set label text to: send copy mail: mail@example.com

<label for="sendcopy"> <input id="sendcopy" type="checkbox" checked="" name="copy"></input>     send copy mail </label> 

i have jquery code:

$(function () {     $("#email").keyup(function () {         var email = $("#email").val();         $("label[for='sendcopy']").val('send copy mail: ' + email);     }); }); 

but when keyup function triggered label changed right, inner input deleted.

<label for="sendcopy">    send copy mail mail@example.com </label> 

i hope understand problem.

you wrap text of label in span make easier select:

<label for="sendcopy">     <input id="sendcopy" type="checkbox" checked="" name="copy"></input>     <span>send copy mail</span> </label> 
$("#email").keyup(function () {     $('label[for="sendcopy"] span').text('send copy mail: ' + $(this).val()); }); 

alternatively, can keep html , amend textnode directly.

$("#email").keyup(function () {     var textnodes= $('label[for="sendcopy"]').contents().filter(function() {         return this.nodetype == 3;     });     textnodes[textnodes.length -1].nodevalue = 'send copy mail: ' + $(this).val(); }); 

example fiddle


Comments

Popular posts from this blog

javascript - Jquery show_hide, what to add in order to make the page scroll to the bottom of the hidden field once button is clicked -

javascript - Highcharts multi-color line -

javascript - Enter key does not work in search box -