Question

我有一个带有选择列表的textarea将内容放入我的textarea。我知道如何计算选择列表中的动态值，但是如果我在将值放在textarea之后写了一些文本，则计数器不起作用。有什么想法吗？

Html：

<div id="selectmodelediv">
    <select>
        <option value=""></option>
        <option value="1111">test1</option>
        <option value="222">test2</option>
    </select>
    <br/>
    <textarea id="targetText" name="targetText" class="champ_tel_txtarea" rows="6" cols="50"></textarea>
    <div id="compteur" class="compteur"></div>
</div>

Jquery：

$('select').change(function () {
    $('#targetText').val($('#selectmodelediv select').val()) //
    $('#compteur').text('255 characters left');
    var max = 255;
    var len = $(this).val().length;
    if (len >= max) {
        $('#compteur').text(' you have reached the limit');
    } else {
        var ch = max - len;
        $('#compteur').text(ch + ' characters left');
    }
});

Answer 1

希望这有帮助。

参考Count characters in textarea

<强> HTML：

<div id="selectmodelediv">
    <select>
        <option value=""></option>
        <option value="1111">test1</option>
        <option value="222">test2</option>
    </select>
    <br/>
    <textarea id="targetText" name="targetText" class="champ_tel_txtarea" rows="6" cols="50" onkeyup="countChar(this)"></textarea>
    <div id="compteur" class="compteur"></div>
</div>

<强>使用Javascript：

var max = 255;

$(document).ready(function(){
$('select').change(function () {
    $('#targetText').val($('#selectmodelediv select').val()) //
    $('#compteur').text('255 characters left');

    var len = $(this).val().length;
    if (len >= max) {
        $('#compteur').text(' you have reached the limit');
    } else {
        var ch = max - len;
        $('#compteur').text(ch + ' characters left');
    }
});
})
function countChar(val) {
    var len = val.value.length;
    if (len >= max) {
        $('#compteur').text(' you have reached the limit');
    } else {
        var ch = max - len;
        $('#compteur').text(ch + ' characters left');
    }
}

Answer 2

问题是您没有绑定textarea的更改事件，只绑定select。请参阅此处以获取工作示例：http://jsfiddle.net/h2ejR/。

的JavaScript

function UpdateCharactersLeft(element) {
    var max = 255;
    var len = $(element).val().length;

    if (len >= max) {
        $('#compteur').text(' you have reached the limit');
    } 
    else {
        var ch = max - len;
        $('#compteur').text(ch + ' characters left');
    }
}

$('select').change(function () {
    $('#targetText').val($('#selectmodelediv select').val());
    UpdateCharactersLeft(this);
});

$('#targetText').on('keyup', function() {
    UpdateCharactersLeft(this);
});

HTML

<div id="selectmodelediv">
    <select>
        <option value=""></option>
        <option value="1111">test1</option>
        <option value="222">test2</option>
    </select>
    <br/>
    <textarea id="targetText" name="targetText" class="champ_tel_txtarea" rows="6" cols="50"></textarea>
    <div id="compteur" class="compteur"></div>
</div>

Answer 3

我想你错过了一个关键事件。试试这个：



  $('select').change(function () {
      vv = $(this).val();
      $('#targetText').val(function(i, old){return old+vv}).trigger('keyup');
  })
  $('#targetText').keyup(function(){
      $('#compteur').text('255 characters left');
      var max = 255;
      var len = $(this).val().length;
    if (len >= max) {
       $('#compteur').text(' you have reached the limit');
    } else {
        var ch = max - len;
        $('#compteur').text(ch + ' characters left');
    }
  });

Answer 4

您需要使用以下所有事件：

.change
.keydown
.keypress
.keyup
.blur
.focus

所以把你的函数放在变量中，所以：

var counter = function() {
    $('#targetText').val($('#selectmodelediv select').val()) //
    $('#compteur').text('255 characters left');
    var max = 255;
    var len = $(this).val().length;
    if (len >= max) {
        $('#compteur').text(' you have reached the limit');
    } else {
        var ch = max - len;
        $('#compteur').text(ch + ' characters left');
    }
});

$('select').change(counter);
$('select').keydown(counter);
$('select').keypress(counter);
$('select').keyup(counter);
$('select').blur(counter);
$('select').focus(counter);

使用动态值计算和限制textarea中的字符

4 个答案:

的JavaScript

HTML