javascript 限制用户在 textarea 中粘贴最多 (40) 个字符

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11722583/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 14:07:30  来源:igfitidea点击:

Restrict the user to paste max (40 ) Characters in textarea

javascriptasp.nethtmlasp.net-mvc

提问by saTech

I am restricting the user to enter a max limit(40Char) of characters in a text area. I am Calling this below JSfunction on onKeyUpevent of textarea.

我限制用户在文本区域中输入最大限制(40Char)字符。我打电话下面这样JS的功能onKeyUp的事件textarea

But when i copy paste a content which is more than 40chars, not gettinng pop-up(Alert) until i do a keyup/down on the textarea.

但是,当我复制粘贴超过 40 个字符的内容时,直到我在 textarea 上执行键盘上/下键后,才会弹出(警报)。

function checkLength(textBox, e, maxLength) {
  if (textBox.value.length > maxLength - 1) {        
     alert("* You have reached max limit ");
     textBox.value = textBox.value.substr(0, maxLength);
  }
  else {
     alert(maxLength - textBox.value.length + " characters remaining");
  }
}

Is there a way to get alert without keyup/downafter pasting into textarea?

有没有办法在没有keyup/down粘贴到后获得警报textarea

采纳答案by saTech

Got the solution guys :)

得到了解决方案的家伙:)

onKeyUp = "checkLength(this);">
</form>
<script>
function fncKeyLength(textBox){
if (window.event.ctrlKey){
if (window.event.keyCode == 86)//Paste 
if (textBox.value.length > maxLength - 1)
{            
  alert("* You have reached max limit ");
  textBox.value = textBox.value.substr(0, maxLength); 
}
</script>

回答by Gerald Versluis

You should probably use the onChangeevent for that

您可能应该onChange为此使用该事件

回答by Sasidhar Vanga

If you want to trim the extra characters on the fly, another possible way will be as follows.

如果您想即时修剪多余的字符,另一种可能的方法如下。

  • Create a trim function which will trim characters more than 40. for example - trimText().
  • onFocus - add a setIntervalfunction to call trimText()after every 500 milli seconds.
  • onBlur - clear setIntervalfunction and run trimText()once again.
  • onChange - run trimText()once again. This willbe an extra check, if needed.
  • 创建一个修剪函数,将修剪超过 40 个字符。例如 - trimText()
  • onFocus - 添加一个每 500 毫秒后setInterval调用的函数trimText()
  • onBlur - 清除setInterval函数并trimText()再次运行。
  • onChange -trimText()再次运行。如果需要,这将是额外的检查。

Based on your requirement you can update the time duration.

根据您的要求,您可以更新持续时间。

Sample : http://jsfiddle.net/codebombs/AyLdW/

示例:http: //jsfiddle.net/codebombs/AyLdW/

If you want to show only one alert message, then use onchange.

如果您只想显示一条警报消息,请使用onchange

Demo : http://jsfiddle.net/codebombs/3Jdvg/1/

演示:http: //jsfiddle.net/codebombs/3Jdvg/1/

回答by Deepak Kothari

Suppose we have an asp Textbox,then we can use "OnPaste" event as shown below

假设我们有一个 asp 文本框,那么我们可以使用“OnPaste”事件,如下所示

   <asp:TextBox TextMode="MultiLine" runat="server" ID="txtComment_c" 
    onpaste="return maxLengthPaste(this, 40)" MaxLength="40"></asp:TextBox>

Before pasting the content first we need to check how much length was already occupied and then window.clipboard.getdata.length will give us the length of data which is about to paste.Consider the code below

在粘贴内容之前,我们首先需要检查已经占用了多少长度,然后 window.clipboard.getdata.length 会给我们将要粘贴的数据长度。考虑下面的代码

   function maxLengthPaste(field, maxChars) {

        if ((field.value.length + window.clipboardData.getData("Text").length) > maxChars) {
            alert("Cannot have more than " + maxChars + " Characters");
            return false;
        }

    }

回答by Echilon

Something like:

就像是:

$('#textbox1').on('change', function() {
    var currentText = $(this).val();
    if(currentText.length > 40)
        $(this).val(substr(currentText,0,40));
});

There's even an Ellipsisplugin to add an ellipsis (...) for you.

甚至还有一个Ellipsis插件可以为您添加省略号 (...)。