您的位置:首页 > Web前端 > JQuery

Jquery 插件限制文本框输入的字数,包括字母,汉字

2011-04-18 17:38 651 查看
$(document).ready(function() {

$("#txtarea").Limitchar({ txtNote: "#txtarea", txtLimit: "#termLen", isbyte: true, "txtSpan": "#txtSpan" });

});

(function($) {

$.fn.Limitchar = function(options) {

var defaults = {

txtNote: '', //文本框

txtLimit: '', //提示字数的标签

limitCount: 20, //限制的字数

txtSpan: "",

isbyte: false //是否使用字节长度限制(1汉字=2字符)

, txtByte: 1

};

var opts = $.extend(defaults, options)

$(this).keyup(function() {

wordsLimit();

});

$(this).keydown(function() {

wordsLimit();

});

this.each(function() {

//实现代码

});

function wordsLimit() {

$(opts.txtSpan).text(opts.limitCount);

var noteCount = 0;

if (opts.isbyte) {

noteCount = $(opts.txtNote).val().match(/[\x00-\xff]/ig).length;

}

else {

noteCount = $(opts.txtNote).val().length;

}

if (noteCount > opts.limitCount) {

if (opts.isbyte) {

$(opts.txtNote).val($(opts.txtNote).val().substring(0, opts.txtlength + Math.floor((opts.limitCount - opts.txtByte) / 2)));

$(opts.txtLimit).text(opts.limitCount - opts.txtByte);

} else {

$(opts.txtNote).val($(opts.txtNote).val().substring(0, opts.limitCount));

$(opts.txtLimit).text(0);

}

} else {

$(opts.txtLimit).text(opts.limitCount - noteCount);

}

}

};

})(jQuery);

HTML代码

<script type="text/javascript">

$(document).ready(function() {

$("#txtarea").Limitchar({ txtNote: "#txtarea", txtLimit: "#termLen", isbyte: false });

});

</script>

<textarea name="txtarea" id="txtarea" rows="5" cols="50"></textarea>

<br>

共可输入10字符,还剩 <span id="termLen">10</span>个字符
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐