The input length dynamically changes with the input content. The input cursor locates at the rightmost, and the input cursor

The input length dynamically changes with the input content. The input cursor locates at the rightmost, and the input cursor

<Input type = "text" onkeydown = "this. onkeyup ();" onkeyup = "this. size = (this. value. length> 4? This. value. length: 4); "size =" 4 ">

<Input type = "text"> the default size is 20.

If you define the width attribute in the style and want its width to be changed according to the content, there will be no conflict between the two requirements. Therefore, the width attribute cannot be defined in the style.

Function len (s) {// get the length of the input text, one character, two Chinese characters
Var l = 0;
Var a = s. split ("");
For (var I = 0; I <a. length; I ++ ){
If (a [I]. charCodeAt (0) <299 ){
L ++;
} Else {
L + = 2;
}
}
Return l;
}
Or replace Chinese with two characters.

var str_temp = $(".tag_input").val().replace(/[\u4e00-\u9fa5]/g, 'aa');

$(".tag_input").attr("size",str_temp.length);

$(".tag_input").width("auto");

Jq:

$(function(){

                // Propertychange listens for character changes in input and attribute change events                 $( '.zy-price' ).bind( 'input propertychange' ,  function () {                     var  $ this  = $( this );                     console.log($ this );                     var  text_length = $ this .val().length; // Obtain the length of the current text box                     var  current_width = parseInt(text_length) *16; // This value is to change the width before dividing by the length of the current string, and calculate the length of each character.                     console.log(current_width)                     $ this .css( "width" ,current_width+ "px" );                 });             })Position the input cursor in the last position: Method: assign a new value to the input.

$(".tag_input").focus();
$(".tag_input").val('');
$(".tag_input").val($(this).text());