用于所有文本区域的javascript

我想在我所有的文本区域应用我的JS

  $_PAGE->addJSOnLoad("
    $('#textarea').keyup(function() {
      var nombreCaractere = $(this).val().length;
      var msg = nombreCaractere + ' caractére(s)';

      $('#compteur').text(msg);
      '<span id=compteur>' 0 caractére(s)'</span>';
    });
  ");

---

此代码位于我的类textarea的构造函数中，我为所有textarea调用了他1次

您应该将jquery选择器从$'textarea'更改为$'textarea'，以便将文档中的所有textarea作为目标。 此外，您可能希望使用$'.compteur'代替$'compteur'，以便您可以有多个计数器，每个文本区域一个计数器。不要忘记相应地更新html

编辑：请使用$this.find'.compteur'代替$'.compteur'，以便只影响当前文本区域内的计数器

$('#textarea')

选择ID为textarea的HTML元素。所以这将是最大一个textarea元素。所有文本区域的选择器都是

$('textarea')

---

javscript事件处理程序可以接受参数事件，因此

$('textarea').keyup(function() {
  var nombreCaractere = $(this).val().length;
  var msg = nombreCaractere + ' caractére(s)';

  // code for display, todo!
}

将事件处理程序放在页面上的每个文本区域。但是，字符计数的显示有点困难，除非它是一个固定的滚动元素

但是，假设您的文本区域都有一个属性data charcount=[id]，该属性的id为div或其他什么，它将显示字符计数。 然后你可以替换

  // code for display, todo!

与

您的示例文本区域应该如下所示：

<textarea data-charcount="compteur"></textarea>
<span id="compteur"></span>

请注意：每个id只能出现一次

---

用这个编辑replace event.target，并用字符串concat修复了一个小错误

不确定该代码如何处理一个textarea事件。您使用的是id而不是类。我还没有实际测试它。但是我看不出有什么理由不感谢你的回答，但是现在我在textarea中写下，所有textarea的计数器都已打开@kharhys显然你是对的，但是，必须对所有不同的计数器元素进行一些区分，这是正确的@Jakumi。我相信缺乏区分是导致计数器在所有数据上递增的原因textareas@mokmok我已经编辑了答案并进行了更正，这是有效的，但我已经为第一个文本区域设置了计数器juste：所以。。。您是否为每个文本区域添加了一个计数器？它们不是凭空长出来的。

<textarea data-charcount="compteur"></textarea>
<span id="compteur"></span>