jQuery插件的字符计数 [英] jquery plugin for character count
问题描述
根据Felix提供的代码,我为字符计数脚本制作了一个html页面.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" language="javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
(function($) {
$.fn.charlimit = function(options) {
var def = {
limit: 250,
display: null
};
$.extend(def, options);
var $display = $(def.display);
$display.html(def.limit);
this.bind('change keyup', function() {
var l = $(this).val().length;
$display.html(def.limit - l);
if (l > def.limit) {
$(this).val(function(i, value) {
return value.substring(0, def.limit);
});
$display.html(def.limit - $(this).val().length);
}
});
return this;
};
}(jQuery));
//Plugin Call
$('#message').charlimit({
limit: 10,
display: '#charCount'
});
});
</script>
</head>
<body>
<textarea name="message" id="message" tabindex="4" rows="4" cols="35"></textarea>
<p class="character_limit">Character limit: <span id="charCount"></span></p>
</body>
</html>
我面临的问题是...当字符数变为0并按另一个键时.charcount将显示-60,并且函数(i,value){.....}进入文本区域.
请检查.
谢谢 洛克希·亚达夫(Lokesh Yadav)
函数声明中似乎存在一个小的语法错误.
函数声明的最后一行是:
};
}(jQuery));
但应该是:
};
})(jQuery);
编辑:虽然我没有在Firefox中看到错误,但它似乎可以正常运行,所以这可能不是罪魁祸首.
as per code provide by Felix, i have made a html page for the character count script.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" language="javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
(function($) {
$.fn.charlimit = function(options) {
var def = {
limit: 250,
display: null
};
$.extend(def, options);
var $display = $(def.display);
$display.html(def.limit);
this.bind('change keyup', function() {
var l = $(this).val().length;
$display.html(def.limit - l);
if (l > def.limit) {
$(this).val(function(i, value) {
return value.substring(0, def.limit);
});
$display.html(def.limit - $(this).val().length);
}
});
return this;
};
}(jQuery));
//Plugin Call
$('#message').charlimit({
limit: 10,
display: '#charCount'
});
});
</script>
</head>
<body>
<textarea name="message" id="message" tabindex="4" rows="4" cols="35"></textarea>
<p class="character_limit">Character limit: <span id="charCount"></span></p>
</body>
</html>
The problem i am facing is... when the character count becomes 0 and i press another key.. charcount will show -60 and the function(i, value) { ..... } gets inside the textarea.
Please check.
Thanks LOkesh Yadav
There seems to be a small syntax inaccuracy in there with the function declaration.. weird that this works, but maybe it's normal...
The last line of the function declaration is:
};
}(jQuery));
But should be:
};
})(jQuery);
edit: I didn't get an error in Firefox though, and it seemed to work fine, so this is probably not the culprit.
这篇关于jQuery插件的字符计数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!