2011-11-29 98 views
0

我想要做一个脚本来插入一个文本框或文本区后多少个字符的用户已使用和剩余什么。为了做到这一点,我正在寻找具有MVC3添加数据验证功能的DOM对象。JQuery动态地添加一个元素,然后更新它

我希望我的JQuery脚本在文本框后自动插入标签,然后在每次按键后更新它。我可以得到它来插入标签,但我无法弄清楚如何让它更新它。我已经添加了以下代码:

// controls character input/counter 
$("[data-val-length-max]").keyup(function (e) { 
var $this = $(this), 
    charLength = $this.val().length, 
    charLimit = $this.attr("data-val-length-max"); 
// Displays count 
var $chars = $this.nextAll("<span>"); 

if ($chars != "null") { 
    $chars.html(charLength + " of " + charLimit + " characters used"); 
} 
else { 
    $this.after("<span>" + charLength + " of " + charLimit + " characters used" + "</span>").addClass("block"); 
} 
// Alert when max is reached 
// if ($this.val().length > charLimit) { 
//  $this.nextAll("span").html("<strong>You may only have up to " + charLimit + " characters.</strong>"); 
// } 
}); 

我对JQuery还很新,我很抱歉,可能是一些糟糕的编码!它可能值得说明的是,将会有多个字符限制文本框到单个页面的实例,所以脚本需要确保它只为其自身而不是其他元素添加/更新跨度。

+0

可以使用jQueires变化() - 但是文本框只会在失去焦点时触发,而不是按键......但是您可以使用'$('#id')。keypress(function(){alert(“Handler for .keypress()called。”)});' – ppumkin

+0

尝试使用$ chars.text()如果您只是更新文本而不是$ chars.html() – Matthew

回答

0

更改,如果条件:

$chars != "null" 
$chars.size() // size returns 0 if it found no elements 

我得到它的工作在这个提琴修复一些其他的问题,为您:http://jsfiddle.net/mAMM5/1/

相关问题