Gemeinschaft Lernen Tools-Bibliothek Freizeit

Deutsch

Heim > Web-Frontend > js-Tutorial > js限制输入框可输入字节数代码_表单特效

js限制输入框可输入字节数代码_表单特效

WBOY

Freigeben： 2016-05-16 18:36:18

Original

1029 Leute haben es durchsucht

代码如下：（本来基于原型封装了一下，发现完全在增加代码量，又改回来了）

感谢sparks345提出粘贴时的问题
这样的话，只能多加几个事件onpropertychange,oninput, obj.watch("value",function(id,oval,nval){})
具体可以看这里，跟踪input值改变兼容处理

<title>限制输入字节数</title> 
<meta name="author" content="sohighthesky"> 
<style type="text/css"> 
#div1 {width:500px;margin:20px auto;} 
#div1 ul {list-style-type:decimal;line-height:25px;} 
</style> 
 
 
<div id="div1"> 
<ul> 
<li>可输入5个字节：<input type="text" id="txt1" value="你好e">
</li> 
<li>可输入6个字节：<input type="text" id="txt2" value="hello,">
</li> 
<li>可输入7个字节：<input type="text" id="txt3" value="，he">
</li> 
<li>可输入n个字节：<input type="text" id="txt4">
</li> 
</ul> 
</div> 
 
<script type="text/javascript"> 
/*! 
*author:sohighthesky 
*Date:2010-1-16 
*/ 
!function(){ 
var len=function(s){//获取字符串的字节长度 
s=String(s); 
return s.length+(s.match(/[^\x00-\xff]/g) ||"").length;//加上匹配到的全角字符长度 
}, 
limitDo=function(limit){ 
var val=this.value; 
if(len(val)>limit) { 
//val=val.substr(0,limit); 
while(len(val=val.substr(0,val.length-1))>limit); 
this.value=val; 
} 
},$=function(id){return typeof(id)==='string'?document.getElementById(id):id;};

$("txt1").onkeyup=function(){limitDo.call(this,5)}; 
$("txt2").onkeyup=function(){limitDo.call(this,6)}; 
$("txt3").onkeyup=function(){limitDo.call(this,7)}; 
}(); 
</script>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

出处：http://www.cnblogs.com/sohighthesky/

Verwandte Etiketten：

字节数输入框

Quelle：php.cn

Vorheriger Artikel：javascript 构建一个xmlhttp对象池合理创建和使用xmlhttp对象_javascript技巧 Nächster Artikel：javascript 哈希表(hashtable)的简单实现_javascript技巧

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Neueste Artikel des Autors

Was ist eine NullPointerException und wie behebe ich sie?

2024-10-22 09:46:29
Vom Anfänger zum Programmierer: Ihre Reise beginnt mit C-Grundlagen

2024-10-13 13:53:41
Webentwicklung mit PHP freischalten: Ein Leitfaden für Anfänger

2024-10-12 12:15:51
C entmystifizieren: Ein klarer und einfacher Weg für neue Programmierer

2024-10-11 22:47:31
Entfalten Sie Ihr Programmierpotenzial: C-Programmierung für absolute Anfänger

2024-10-11 19:36:51
Entfesseln Sie Ihren inneren Programmierer: C für absolute Anfänger

2024-10-11 15:50:41
Automatisieren Sie Ihr Leben mit C: Skripte und Tools für Anfänger

2024-10-11 15:07:41
PHP leicht gemacht: Ihre ersten Schritte in der Webentwicklung

2024-10-11 14:21:21
Erstellen Sie alles mit Python: Ein Leitfaden für Anfänger, um Ihrer Kreativität freien Lauf zu lassen

2024-10-11 12:59:11
Der Schlüssel zum Programmieren: Die Leistungsfähigkeit von Python für Anfänger freischalten

2024-10-11 12:17:31

Aktuelle Ausgaben

Das Eingabeelement konnte nicht von der Website abgerufen werden Ich versuche also, ein Eingabeelement von Twitter abzurufen, aber wenn ich es ausführe, er...

Aus 2024-04-06 18:59:57

0

1

442

Ermitteln Sie den gesamten Rückgabewert der Eingabefeldmethode Ich versuche, den vom Benutzer eingegebenen Gesamtwert zu ermitteln. Holen Sie sich ein Ag...

Aus 2024-04-06 18:19:37

0

1

380

Datensatzabfrage unter Teilwertbedingungen – gemeinsame Nutzung von SQL-Kenntnissen Ich habe eine Tabelle namens zipcode, die eine Spalte namens code enthält. Die Spalte „Cod...

Aus 2024-04-06 16:01:26

0

1

395

Auch nach dem Löschen bleibt der Wert meiner Dateieingabe erhalten Wie Sie im Screenshot sehen können. Ich wähle eine Datei aus, behalte das Popup bei, ohne ...

Aus 2024-04-06 15:44:52

0

1

384

Die Polsterung des Elternteils wird vom klebrig positionierten Kind ignoriert Wie kann verhindert werden, dass klebrige Elemente hinter den Header gelangen? Das aktuell...

Aus 2024-04-06 11:42:51

0

1

338

verwandte Themen

Mehr>

Beliebte Empfehlungen

Beliebte Tutorials

Mehr>

Verwandte Tutorials

Beliebte Empfehlungen

Aktuelle Kurse

Neueste Downloads

Mehr>

Web-Effekte

Quellcode der Website

Website-Materialien

Frontend-Vorlage