Maison > interface Web > tutoriel HTML > le corps du texte

input文本框实现宽度自适应代码实例,input文本框_html/css_WEB-ITnose

WBOY
Libérer: 2016-06-24 11:38:08
original
1874 Les gens l'ont consulté

 

 

本章节介绍一下如何让一个文本框的宽度能够随着文本框中的内容的宽度增长而增长,也就是能够实现宽度自适应效果。

代码实例如下:

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="author" content="http://www.100sucai.com" /><title>www.100sucai.com</title><script type="text/javascript">window.onload=function(){  var otxt=document.getElementById("txt");  otxt.onkeyup=function(){    this.size=(this.value.length>4?this.value.length:4);  }}</script></head><body><input type="text" id="txt" size="4"/> </body></html>	
Copier après la connexion

以上代码实现了我们的要求,代码非常的简单,注册onkeyup事件处理函数,此函数可以判断当前输入内容的长度是否大于默认长度,如果不大于,则文本框的长度就是4,否则就是输入内容的长度。

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal