Question

英语不是我原生的习语，所以请提前道歉，语法不好。

我正在使用javascript来计算textarea的字符，代码工作顺利地显示字符限制在键入时减少，使用此代码我在textarea上调用一个php方法从数据库调用文本，而heres是问题出现的地方，在加载时测试页面时，它会在textarea上显示文本，但是字符限制保持在500，当然如果你在显示正确字符限制的textarea上键入，它会改变值。

如何在页面加载时设置显示正确的字符限制？

这是我的代码：

HTML CODE：

<tr>
<td align="center" colspan="4">
<textarea "rows="10" cols="35" onKeyPress="return charLimit(this)" onKeyUp="return characterCount(this)"><?php echo $oRep->getDescripcion(); ?> </textarea> 
</td>
</tr>

<tr>
<td align="center" colspan="4"><p><strong><span id="charCount">500</span></strong> Caracteres disponibles.</p></td>
</tr>

JS CODE：

var maxLength=500;
function charLimit(el) {
    if (el.value.length > maxLength) return false;
    return true;
}
function characterCount(el) {
    var charCount = document.getElementById('charCount');
    if (el.value.length > maxLength) el.value = el.value.substring(0,maxLength);
    if (charCount) charCount.innerHTML = maxLength - el.value.length;
    return true;
}

我尝试在像onchange="return charLimit(this)这样的textarea上添加一个事件，但没有任何变化。

Answer 1

将此<body onload="characterCount(document.getElementById('text'))">添加到您的正文标记中，并将textarea的ID设为“text”。

Answer 2

首先，我将为该textarea添加一个id，让我们说“描述文本区域”。其次，我会倾听＆＃39; onload＆＃39;身体上的事件（例如），以及内部上传处理程序我执行此操作：

// get reference to body
var body = document.getElementsByTagName('body')[0];

// listening for onload event
body.addEventListener('load', loadHandler);

function loadHandler() {
    // get reference to our description text area
    var descriptionTextArea = document.getElementById('descriptionTextArea');

    // call method with reference to descriptionTextArea as parameter
    characterCount(descriptionTextArea);
}

通过这种方式，我们称之为“角色计数”＆＃39;页面加载方法，它应该正确计算字符数而无需用户交互。

Textarea字符计数在页面加载时失败

2 个答案: