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

<input type="text">的默认size就是20

如果你在style里定义了width属性,又要让它的width根据内容来变化,两个要求不就矛盾了吗.所以这里不能在style里定义width属性.

function len(s) { //获取输入文本长度,字符占一位,汉字两位
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;
}
或者将中文替换成两个字符
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监听input里面的字符变化,属性改变事件
               $('.zy-price').bind('input propertychange'function() {
                   var $this = $(this);
                   console.log($this);
                   var text_length = $this.val().length;//获取当前文本框的长度
                   var current_width = parseInt(text_length) *16;//该16是改变前的宽度除以当前字符串的长度,算出每个字符的长度
                   console.log(current_width)
                   $this.css("width",current_width+"px");
               });
           })
 
实现input光标定位在最后一位:
方法:给input重新赋值
$(".tag_input").focus();
$(".tag_input").val('');
$(".tag_input").val($(this).text());

input长度随输入内容动态变化 input光标定位在最右侧的更多相关文章

  1. 编辑表格输入内容、根据input输入框输入数字动态生成表格行数、编辑表格内容提交传给后台数据处理

    编辑表格输入内容.根据input输入框输入数字动态生成表格行数.编辑表格内容提交传给后台数据处理 记录自己学习做的东西,写的小demo,希望对大家也有帮助! 代码如下: <!DOCTYPE ht ...

  2. jQuery计算文本宽度和input标签根据输入字符动态自适应宽度的实现

    jQuery计算文本宽度的原理是利用html提供的<pre>标签,向dom中动态添加<pre>标签,标签里的内容就是要测试长度的文本,获取完长度之后再删除刚才添加的<pr ...

  3. 使用iScroll时,input等不能输入内容的解决方法

    做移动平台的应用,使用iscroll使屏幕上下滑动.发现当使用iscroll后,input等不能输入内容了.只要在iscroll.js文件中加入如下代码就ok了. function allowForm ...

  4. 使用iScroll时,input等不能输入内容的解决方法(share)

    最近做移动平台的应用,使用iscroll使屏幕上下滑动.发现当使用iscroll后,input等不能输入内容了.只要在iscroll.js文件中加入如下代码就ok了. function allowFo ...

  5. input 正则限制输入内容

    js 限制input只能输入数字小数点也不能输入或者是只能输入数字,能输小数点等等,本文大致整理了一些,感兴趣的朋友可以收藏下   代码如下: 1 <input type="text& ...

  6. input框监控输入内容

    $(".input").bind("input porpertychange",function(){ console.log($(".input&q ...

  7. vue时时监听input输入框中 输入内容 写法

    Vue input 监听 使用 v-on:input="change" 实现即可 App.vue <template> <div> <md-field ...

  8. 小程序TAB列表切换内容动态变化,scrollview高度根据内容动态获取

    滑动tab选项卡 一.在小程序里面tab选项卡是用的是自带的swiper组件,下面直接上代码 <view class="container"> <view cla ...

  9. UITextField(一)监听输入内容的变化(开发笔记)

    //添加事件UIControlEventEditingChanged [textField addTarget:self action:@selector(textFieldDidChange:) f ...

随机推荐

  1. 在Navicat 中给Mysql中的某字段添加前缀00

    第一次分享心得,希望大家多多关注. 我遇到的情况是这样的,在Navicat中某表的varchar字段内容长度不够5的在内容前面添加‘0’:如字段内容是 101 我就要改成00101: 其中有2个难点: ...

  2. Final 关键字

    1.涵义 最一般的意思就是声明 "这个东西不能改变".之所以要禁止改变,可能是考虑到两方面的因素:设计或效率. final 关键字可以用来修饰变量.方法和类,修饰变量表示变量不能被 ...

  3. 搭建hadoop、hdfs环境--ubuntu

    最近在学习hadoop相关知识,就在本机上安装了hadoop,遇到了一些坑,也学到了不少.仅此记录我的安装过程,及可能遇到的问题.供参考.交流沟通见页末. 软件准备 >  虚拟机(VMware) ...

  4. [入门向选讲] 插头DP:从零概念到入门 (例题:HDU1693 COGS1283 BZOJ2310 BZOJ2331)

    转载请注明原文地址:http://www.cnblogs.com/LadyLex/p/7326874.html 最近搞了一下插头DP的基础知识……这真的是一种很锻炼人的题型…… 每一道题的状态都不一样 ...

  5. coder该何去何从

    无论是什么语言的学习,都不是一帆风顺的,如今随着编程大军的壮大,工作越来越难找,各位coder已经把中心偏移到了学历上面,导致技术水平的参差不齐,以及虚假学历的泛滥,这样的恶性循环下,不知前路在何方?

  6. C++中加const与不加const的区别

    “常量”与“只读变量”的区别. 常量肯定是只读的,例如5, "abc",等,肯定是只读的,因为常量是被编译器放在内存中的只读区域,当然也就不能够去修改它. “只读变量”则是在内存中 ...

  7. 前端到后台ThinkPHP开发整站(1)

    1.前言: 我个人从来没有写过博客文章,作为一个程序员没有自己的博客算是一个合格的程序员,所以我地想想也要经营起一个的博客,做一个小项目,写这博客算就做这个项目的一个项目笔记吧!现在自学着ThinkP ...

  8. CSS3基础(3)——CSS3 布局属性全接触

    一. 弹性盒模型 1.弹性盒子模型介绍 弹性盒模型(Flexible Box或Flexbox)是一个CSS3新增布局模块,官方称为CSS Flexible Box Layout Module,用于实现 ...

  9. SQL之运算符操作

    算数运算符: 用select可以实现加减乘除,求模操作等: 加法操作,      减法操作,      乘法操作,      除法操作,      DIV 除法操作,      求模操作,      ...

  10. 迭代器(Iterator)

    迭代器是一种设计模式,它是一个对象,它可以遍历并选择序列中的对象,而开发人员不需要了解该序列的底层结构.迭代器通常被称为"轻量级"对象,因为创建它的代价小. Java中的Itera ...