0

0

基于jquery的inputlimiter 实现字数限制功能_jquery

php中文网

php中文网

发布时间:2016-05-16 18:26:06

|

1410人浏览过

|

来源于php中文网

原创

看下效果图:
基于jquery的inputlimiter 实现字数限制功能_jquery
源代码:

复制代码 代码如下:





Input Limiter Demo

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery.inputlimiter.1.2.js"></script>

<script type="text/javascript"> <br>function create_xmlDoc(){ <br>var xmlDoc = null; <br>try //Internet Explorer <br>{ <br>xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); <br>} <br>catch(e) <br>{ <br>try //Firefox, Mozilla, Opera, etc. <br>{ <br>xmlDoc=document.implementation.createDocument("","",null); <br>} <br>catch(e) <br>{ <br>alert(e.message); <br>return; <br>} <br>} <br>return xmlDoc; <br>} <br><br>$(document).ready(function() { <br>var xmlDoc = create_xmlDoc(); <br>xmlDoc.async=false; <br>xmlDoc.load("test.xml"); <br>var x=xmlDoc.getElementsByTagName("channel"); <br>for( var i=0; i<x.length; i++ ){ <br>if(x[i].getAttribute("CID") == '1'){ <br>num = x[i].childNodes[0].getAttribute("fNum"); <br>strfield = x[i].childNodes[0].getAttribute("FID"); <br>//为每个自定义字段绑定字数限制功能 <br>$("#"+strfield).inputlimiter({ <br>limit: num, <br>remText: '你还能输入 %n 个字', <br>remFullText: '你输入的字数已超过限制数值', <br>limitText: '' <br>}); <br>//$("#hidNum").val(num); <br>} <br>} <br><br>$("#SendLimiter").click(function(){ <br>if($("#Num").val().length==0){ <br>alert("限制字数不能为空!"); <br>return; <br>} <br>if(isdigit($("#Num").val())==0){ <br>alert("请输入数字!"); <br>return; <br>} <br>$.ajax({ <br>url:'SaveLimiter.asp', //后台处理程序 <br>type:'Post', //数据发送方式 <br>data:"Num=" + $("#Num").val() + "&ChannelID=1"+"&Field="+$("#sel").val(), //要传递的数据 <br>success:update_page, //回传函数(这里是函数名) <br>error:errorInfo <br>}); <br>}); <br><br>//回传函数实体,参数为XMLhttpRequest.responseText <br>function update_page (data) { <br>//alert(data); <br>alert("提交成功!"); <br>} <br><br>function errorInfo(data){ <br>alert("提交失败!"+data.responseText); <br>} <br><br>//判断输入值是否是数字 <br>function isdigit(s){ <br>var r,re; <br>re = /\d*/i; //\d表示数字,*表示匹配多个数字 <br>r = s.match(re); <br>return (r==s)?1:0; <br>} <br>}); <br></script>


字数限制功能列子




字数限制
标题:

自定义字段1:

自定义字段2:










这里的限制字数是动态设置的,所以配置了一个ASP页面和一个XML文件

ASP

复制代码 代码如下:

num = Trim(Request("Num")) '字数限制值
channelid = Trim(Request("ChannelID")) '频道ID
sfield = Trim(Request("Field")) '需设定的字数限制值的字段

set objDom = server.CreateObject("MicroSoft.XMLDom")
objDom.load(Server.MapPath("test.xml"))
Set objNode = objDom.documentElement
'节点长度
newint=objNode.ChildNodes.length-1
for i=0 To newint
'节点id属性
set objarr=objNode.ChildNodes.item(i)
if ( objarr.Attributes.item(1).Text = channelid) then
if( objarr.ChildNodes.item(0).Attributes.item(1).Text = sfield ) then
'直接定位到节点的ID下属性的内容
objDom.getElementsByTagName("channel").item(i).childNodes.item(0).Attributes.item(2).Text = num
exit for
end if
end if
set objarr = Nothing
next
objDom.save(Server.MapPath("test.xml"))
set objNode = Nothing
Set objDom = Nothing
%>


XML

永利在线企业网站管理系统(CMS)1.0 Build 20100612
永利在线企业网站管理系统(CMS)1.0 Build 20100612

修正说明:1,实现真正的软件开源。2,安装界面的美化3,真正实现栏目的递归无限极分类。4,后台添加幻灯片图片的管理,包括添加,修改,删除等。5,修正添加新闻的报错信息6,修正网站参数的logo上传问题7,修正产品图片的栏目无限极分类8,修正投票系统的只能单选问题9,添加生成静态页功能10,添加缓存功能特点和优势1. 基于B/S架构,通过本地电脑、局域网、互联网皆可使用,使得企业的管理与业务不受地域

下载
复制代码 代码如下:






















热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
Golang 并发编程模型与工程实践:从语言特性到系统性能
Golang 并发编程模型与工程实践:从语言特性到系统性能

本专题系统讲解 Golang 并发编程模型,从语言级特性出发,深入理解 goroutine、channel 与调度机制。结合工程实践,分析并发设计模式、性能瓶颈与资源控制策略,帮助将并发能力有效转化为稳定、可扩展的系统性能优势。

2

2026.02.27

Golang 高级特性与最佳实践:提升代码艺术
Golang 高级特性与最佳实践:提升代码艺术

本专题深入剖析 Golang 的高级特性与工程级最佳实践,涵盖并发模型、内存管理、接口设计与错误处理策略。通过真实场景与代码对比,引导从“可运行”走向“高质量”,帮助构建高性能、可扩展、易维护的优雅 Go 代码体系。

1

2026.02.27

Golang 测试与调试专题:确保代码可靠性
Golang 测试与调试专题:确保代码可靠性

本专题聚焦 Golang 的测试与调试体系,系统讲解单元测试、表驱动测试、基准测试与覆盖率分析方法,并深入剖析调试工具与常见问题定位思路。通过实践示例,引导建立可验证、可回归的工程习惯,从而持续提升代码可靠性与可维护性。

0

2026.02.27

漫蛙app官网链接入口
漫蛙app官网链接入口

漫蛙App官网提供多条稳定入口,包括 https://manwa.me、https

56

2026.02.27

deepseek在线提问
deepseek在线提问

本合集汇总了DeepSeek在线提问技巧与免登录使用入口,助你快速上手AI对话、写作、分析等功能。阅读专题下面的文章了解更多详细内容。

4

2026.02.27

AO3官网直接进入
AO3官网直接进入

AO3官网最新入口合集,汇总2026年可用官方及镜像链接,助你快速稳定访问Archive of Our Own平台。阅读专题下面的文章了解更多详细内容。

53

2026.02.27

php框架基础教程
php框架基础教程

本合集涵盖2026年最新PHP框架入门知识与基础教程,适合初学者快速掌握主流框架核心概念与使用方法。阅读专题下面的文章了解更多详细内容。

1

2026.02.27

php框架怎么用
php框架怎么用

本合集专为零基础学习者打造,系统介绍主流PHP框架的安装、配置与基础用法,助你快速入门Web开发。阅读专题下面的文章了解更多详细内容。

4

2026.02.27

无禁词AI聊天软件下载大全
无禁词AI聊天软件下载大全

本合集精选多款免费、无违禁词限制的AI聊天软件,支持自定义角色、剧情畅聊,体验真实互动感。阅读专题下面的文章了解更多详细内容。

19

2026.02.27

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Pandas 教程
Pandas 教程

共15课时 | 1.1万人学习

麻省理工大佬Python课程
麻省理工大佬Python课程

共34课时 | 5.4万人学习

【web前端】Node.js快速入门
【web前端】Node.js快速入门

共16课时 | 2.1万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号