当前位置:
  1. 首页 »
  2. 笔记 »
  3. 正文

input实时显示input内容字数

零分 2,648

input实时显示input内容长度,写这个是因为自定义优站需要入库,入库的标题淘宝很牛逼的限制成了22个字数,因为是自定义后台直接入库的,每次都去数一下字数是不是更牛逼?好吧,这是废话。于是就百度了一下,input实时显示input内容字数。

正常环境的JS:

<input type='text' id='num' name='tel' value='12345' onKeyUp="showLen(this);"> <span id="span">已输入XX位</span>   
  
<script type="text/javascript">   
showLen(document.getElementById("num"));   
function showLen(obj){   
    document.getElementById('span').innerHTML =  obj.value.length +'/15';   
}   
</script>  

因为需要把他放在淘宝的优站上,所以,需要对JS进行一直,而且,很多代码都会被过滤,经过了几个小时的测试,移植过来的代码如下:

输入框:

<input type="text" id="num" class="putcount" name="tel" value="输入您喜欢宝贝关键词"> <span class="putcountspan">0/22</span>   

JS:

KISSY.Event.on(".putcount","keyup mouseup",function(){   
   KISSY.DOM.text(".putcountspan", this.value.length +'/22');   
});  

效果如下:

标签:

JQ各种top,height,width区分

HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight:获取对象的滚动高度。 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度 offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 offsetTop:
知识 2,080

js定时器setinterval越来越快的原因

之前写了一个模板,焦点图的播放速度会越来越快,做过清除过定时器clearInterval,似乎并没有改变,也就放着并无理会! 最近写另一个模板,焦点图调用同样的JS,长时间观察,并没有发现定时器setinterval越来越快的现象!又重新回到之前的模板,仔细的观察了一下,可能是因为设置了两个setinterval的原因! JS的运行时单线程的,两个setinterval可能会发生冲突,导致定时器越来越快!虽然调用了不同的function!完成之后回去去掉一个setinterval再试试! 第二次: 模板需要轮播焦点图,支持手机触屏滑动,效果代码很早之前就写了,使用了setInterval定时器
随笔 3,448

网站设置开灯(亮模式/白天)和关灯(暗模式/黑夜)效果

在很早之前,这个效果叫做开灯/关灯,现在叫做白天/黑夜,曾经有那么一段时间没有看到过这种效果,现在又很多网站/APP都喜欢这种切换白天/黑夜模式。 实现效果:设置2套或者多套色调模板,和之前的那种换皮肤大差不差。所以博客新主题也设置了这么一个效果,样式布局基本没怎么改变,后台设置页升级了一下,很多东西都不再“写死”,可以自由设置! 白天模式效果: 黑夜模式效果: 感觉黑夜的色调比较好看。 总体涉及到的原理: 1、设计2套或者多套CSS样式,可以在body里添加一个class,后面保留class/ID样式名称不变,在不同的样式里给设计一个区域,通过body里的class名调用不同的样式CSS。
笔记 2,298

记一次网页源码顶部空白行的问题处理

正常来说,网页源码顶部如非UFT-8 bom编码的问题,基本不会影响网站的正常运行,但如php生成xml的话,就会出现问题。 因更换了主题(新主题暂时未上线,只是测试),发现xml无法正常显示,查看源码,顶部多出了一行空白行,本地运行正常。 查找原因,基本每个PHP问题都排查了,未发现任何问题,将主题上传到另外一个网站运行,发现正常。基本可以排除是主题的原因,剩下的可能是插件的问题。 查看了插件的源码,发现真的是插件的问题,PHP插件文件底部多出了几行,删除多出的行,重新运行,空白行不见了! 记录下,防止下次又因同样的原因而花时间去排查!
笔记 2,417

wordpress禁用REST API导致古腾堡编辑器发布文章出错问题

wordpress禁用REST API,在function.php中加入以下代码: add_filter("json_enabled", "__return_false"); add_filter("json_jsonp_enabled", "__return_false"); add_filter("rest_enabled", "__return_false"); add_filter("rest_jsonp_enabled", "__return_false"); remove_action("init", "rest_api_init"); remove_action("rest_ap
笔记 1,266