1. <input type="text" id="item_name" placeholder="项目名称" maxlength="42"/>
<span id="item_num"><em id="item_nu">30</em>/30</span>
2. <script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script>
$(function() {
var IteNum = $('#item_name'),
IteN = $('#item_nu');
function getLength(str) {
return String(str).replace(/[^\x00-\xff]/g, 'aa').length;
}
IteNum.on('keyup',function() {
var num = Math.ceil(getLength(IteNum.val()) / 2);
IteN.text(30 - num);
var errorNum = 30 - num;
if (errorNum < 0) {
IteN.css('color', 'red')
} else {
IteN.css('color', '#5c5c5c')
}
});
})
</script>