0顶

限制表单输入的代码

稿源：互联网 2022-08-10 06:34:26 点击： 111 撤稿纠错

限制表单输入的代码，有个进度条提示输入的宽度。

以下讨论的是和限制进度条特效相关的限制表单输入的代码教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

有什么问题请到<a href='/bbs/index.asp?boardid=2'>论坛</a>中发表<br>



<html>
<head>
<style type="text/css">

.progress{
width: 1px;
height: 14px;
color: white;
font-size: 12px;
  overflow: hidden;
background-color: navy;
padding-left: 5px;
}

</style>

function textCounter(field,counter,maxlimit,linecounter) {
// text width//
var fieldWidth =  parseInt(field.offsetWidth);
var charcnt = field.value.length;

// trim the extra text
if (charcnt > maxlimit) { 
field.value = field.value.substring(0, maxlimit);
}

else { 
// progress bar percentage
var percentage = parseInt(100 - (( maxlimit - charcnt) * 100)/maxlimit) ;
document.getElementById(counter).style.width =  parseInt((fieldWidth*percentage)/100)+"px";
document.getElementById(counter).innerHTML="Limit: "+percentage+"%"
// color correction on style from CCFFF -> CC0000
setcolor(document.getElementById(counter),percentage,"background-color");
}
}

function setcolor(obj,percentage,prop){
obj.style[prop] = "rgb(80%,"+(100-percentage)+"%,"+(100-percentage)+"%)";
}

</script>
</head>

</form>

</body>
</html>

<br><br><br>
<p><font color=red>//网站:http://www.alixixi.com</font></p>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

关于限制表单输入的代码的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/2008071496286.shtml方便下次再访问哦。

·上一篇： 使文本竖型显示的特效代码
·下一篇： META标签生成器

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

限制表单输入的代码

文章分类LIST >>返回首页

最新游戏

最新新闻