为什么我无法获得此var的值？

Question

I want to create a live change field input system with jQuery. This is my code:

 $(function() { $('td').on('dblclick', function() { var tdValue = $(this).text(); var tdTag = $(this).html(); tdTag = '<input id="newClass" type="text" value="' + tdValue + '">'; $(this).html(tdTag); $('input#newClass').on('change', function() { var inputVal = $(this).val(); alert('inputVal = ' + inputVal); var inputTag = $(this).html(); alert('inputTag = ' + inputTag); var var3 = '<span> var3 ' + inputTag + '</span>'; alert(var3); }) }) }) 

Why is inputTag and var3 empty? This is my (very simple) html code

Note that the td tags are repeated using a PHP while loop. Thank you in advance.

Answer 1

Now I don't have enough reputation to comment and I'm still confused. Try following codes and see if anything suits you.

var inputTag = $(this)[0].outerHTML;

or

var inputTag = $(this).parent()[0].outerHTML;

or

var var3 = '<span>' + inputVal + '</span>';
$(this).after(var3);
$(this).remove();

or if you just want to make the input field read only, try with

$(this).prop("readonly", true);