input长度随输入内容动态变化 input光标定位在最右侧
<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"); }); })$(".tag_input").focus();
$(".tag_input").val('');
$(".tag_input").val($(this).text());
input长度随输入内容动态变化 input光标定位在最右侧的更多相关文章
- 编辑表格输入内容、根据input输入框输入数字动态生成表格行数、编辑表格内容提交传给后台数据处理
编辑表格输入内容.根据input输入框输入数字动态生成表格行数.编辑表格内容提交传给后台数据处理 记录自己学习做的东西,写的小demo,希望对大家也有帮助! 代码如下: <!DOCTYPE ht ...
- jQuery计算文本宽度和input标签根据输入字符动态自适应宽度的实现
jQuery计算文本宽度的原理是利用html提供的<pre>标签,向dom中动态添加<pre>标签,标签里的内容就是要测试长度的文本,获取完长度之后再删除刚才添加的<pr ...
- 使用iScroll时,input等不能输入内容的解决方法
做移动平台的应用,使用iscroll使屏幕上下滑动.发现当使用iscroll后,input等不能输入内容了.只要在iscroll.js文件中加入如下代码就ok了. function allowForm ...
- 使用iScroll时,input等不能输入内容的解决方法(share)
最近做移动平台的应用,使用iscroll使屏幕上下滑动.发现当使用iscroll后,input等不能输入内容了.只要在iscroll.js文件中加入如下代码就ok了. function allowFo ...
- input 正则限制输入内容
js 限制input只能输入数字小数点也不能输入或者是只能输入数字,能输小数点等等,本文大致整理了一些,感兴趣的朋友可以收藏下 代码如下: 1 <input type="text& ...
- input框监控输入内容
$(".input").bind("input porpertychange",function(){ console.log($(".input&q ...
- vue时时监听input输入框中 输入内容 写法
Vue input 监听 使用 v-on:input="change" 实现即可 App.vue <template> <div> <md-field ...
- 小程序TAB列表切换内容动态变化,scrollview高度根据内容动态获取
滑动tab选项卡 一.在小程序里面tab选项卡是用的是自带的swiper组件,下面直接上代码 <view class="container"> <view cla ...
- UITextField(一)监听输入内容的变化(开发笔记)
//添加事件UIControlEventEditingChanged [textField addTarget:self action:@selector(textFieldDidChange:) f ...
随机推荐
- 腾讯 AlloyCrop 1.0 发布
写在前面 AlloyCrop 这个项目是8个月前发布的,作为AlloyFinger 的典型案例,发布之后被BAT等其他公司广泛使用.但是发布之后,有两个问题一直没有抽出时间去解决: 裁剪图像的分辨率太 ...
- 关于canvas画布使用fillRect()时高度出现双倍效果解决办法
当设置canvas的宽度和高度时,只有内嵌css有效,外部css会出现拉伸的情况,例如: <!DOCTYPE html> <html lang="en"> ...
- year:2017 month:7 day:19
2017-07-19 JavaScript 一:javascirpt的对象 1:数组对象 声明方式:(1)var arr=new Array(): (2)var arr=new Array(12): ...
- Web项目、Http协议简介
Web 静态web项目 静态web项目就是一个文件夹.静态Web项目 就是文件夹中都是静态资源. 如何将web项目部署到tomcat? 将web项目的文件夹复制到webapps目录下.比如把test文 ...
- Vue组件基础用法
前面的话 组件(Component)是Vue.js最强大的功能之一.组件可以扩展HTML元素,封装可重用的代码.根据项目需求,抽象出一些组件,每个组件里包含了展现.功能和样式.每个页面,根据自己所需, ...
- 安徽省2016“京胜杯”程序设计大赛_K_纸上谈兵
纸上谈兵 Time Limit: 1000 MS Memory Limit: 65536 KB Total Submissions: 3 Accepted: 1 Description 战国时 ...
- [HNOI2013]游走 期望+高斯消元
纪念首道期望题(虽说绿豆蛙的归宿才是,但是我打的深搜总觉得不正规). 我们求出每条边的期望经过次数,然后排序,经过多的序号小,经过少的序号大,这样就可以保证最后的值最小. 对于每一条边的期望经过次数, ...
- LoadRunner+Android模所器录制脚本
为了测试Android软件的服务端的功能,需要重现某些客户端操作,便于发现功能问题,性能问题.也方便客户端与本机服务端特别是服务端代码进行断点调试.这个时候需要对网络操作进行重现. loadRunne ...
- 模拟exit()退出命令实现
1.当输入exit命令是退出程序,如果输入其他的就打印====> 方法一while True: username=input("请输入你的用户名:>>>") ...
- easyui1.2.6 validate输入框验证在火狐下的一个bug
easyui版本1.2.6,其他版本未测试是否有这个问题. 问题描述:FF浏览器中,当前输入框需要失去焦点验证,在编辑完成后不点击其他地方使输入框失去焦点,而直接点击保存按钮,此时只会进行输入框失去焦 ...