Ich habe Probleme herauszufinden, warum mein JavaScript nicht richtig funktioniert. Seine mit j Query und seine soll alle Textbereich-Tags auswählen und dann für jeden Textbereich zählen die Anzahl der Zeichen in ihnen eingegeben und dann nicht zulassen, dass der Benutzer mehr eingeben, nachdem es die maximale Länge trifft, auch zeigt ein Zeichen-Zähler unter jedem Textbereich Feld. Es werden nur die verbleibenden Zeichen angezeigt, aber nicht nach jedem Tastendruck dekrementiert und auch nicht angehalten, wenn die maximale Länge erreicht ist. Es werden auch nicht alle Textbereiche ausgewählt, sondern nur der erste, den es findet.
Hier ist mein TextAreaCounter.js
$(document).ready(function){
var $texts = $('textarea[maxlength]');
$texts.each(function){
$var $this = $(this),
max = $(this).attr('maxlength'),
textId = $(this)attr.('id'),
$parent = $this.parent(),
countId = textId+'-count';
$div = $('<div>Characters Remaining: </div>').addClass('count-down').insertAfter($this);
$input = $('<input></input>').attr({
type:"text",
readOnly: "readOnly",
value: max,
id: countId
}).css({
width: "25px"
marginTop: "5px"
marginBottom: "10px"
}).addClass('readOnly').appendTo($div);
$this.on({
keyup: function(){
val = $this.val(),
countVal = $('#'+countId).val(),
if(val.length > max){
$this.val(val.substr(0,max));
alert('Max length exceeded: ' +max);
return false;
}else{
$('#'+countId).val(max-val.length);
}
},
blur: function(){
val=$this.val();
if(val.length > max){
$this.val(val.substr(0,max));
alert('Max length exceeded: ' +max);
return false;
}else{
$('#'+countId).val(max-val.length);
}
}
});
});
});
Wenn ich einige Warnungen hinzugefügt, nicht in den Code hier gezeigt, es zeigte, dass es nicht immer auf die this.on Abschnitt mit dem keyup Ereignis. Ich habe diese externe js-Datei zu einer jsp-Datei, die meine Seite gemacht wird und hat meine Textbereiche in. Ich füge auch ein id- und maxlength-Attribut für das textarea-Element hinzu. Jede Hilfe wäre großartig, danke.