Textarea charCount-防止用户粘贴 [英] Textarea charCount - Preventing user paste

查看:104
本文介绍了Textarea charCount-防止用户粘贴的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

下面的代码工作正常,但如果我粘贴的字符串超过10个字符,则只能粘贴前10个字符.当前它不执行此操作,如何防止粘贴10个以上的字符?

http://jsfiddle.net/qfzkw/2/

解决方案

如前所述,<textarea maxlength="10">将在少量情况下适用-但不是全部.

很难确定如何防止用户(例如在Firefox中)进入文本区域,选择浏览器菜单Edit,然后单击Paste.如何防止这种情况我真是茫然.您可以检查keydown事件以防止ctrl + v.您可以禁用上下文菜单以禁止右键单击文本区域(尽管恶意用户可以编辑前端javascript,然后重新启用此功能).

简而言之,没有通用的方法可以防止用户以适当的方式粘贴.

但是,您可以破解解决方案(当我似乎无法继续进行您真正想要的事情时,总是我的最爱).我要建议的这种方法取决于您运行了多少个计时器.如果您有多个动画计时器,Google建议您尝试将它们全部折叠为一个其他的计时器单元.如果是这种情况,请重构您的计时器.

实现全局计时器.实现基于该计时器每25ms运行一次的功能.缓存文本区域的内容.查看这些内容是否已更改.

textarea

<textarea id="maintextarea"></textarea>

脚本

/*init*/
var globalTimer = new Date();
var cachedText = document.getElementById("maintextarea").value;
var iterationCount = 0;

function cacheText() {
    cachedText = document.getElementById("maintextarea").value;
}

function upDateTimer() {
    globalTimer = new Date();
    var timerTimeout = setTimeout('upDateTimer()', 5);
    timeBasedOperations();
}
upDateTimer();

function timeBasedOperations() {
    iterationCount++;//this will allow timing to occur
    //TODO: Add in other timers calls based on global timer
    if (iterationCount % 5) {//every fifth iteration (hence 25ms)
        checkTextArea();
    }
}

function checkTextArea() {
    var currentText = document.getElementById("maintextarea").value;
    var textArea = document.getElementById("maintextarea");
    if (currentText.length > cachedText.length) {
        //TODO: Add additional logic for catching a paste or text change
        textArea.value = currentText.substr(0, 10);
    }
    cacheText();
}

我认为尽管它实现了计时器,但这是一个非常实用的解决方案.它也可以正常工作(已测试).

:)

The code below is working fine except that if I paste a string with more than 10 characters in it, it should only paste in the first 10 characters. Currently it does not do this, how do I prevent more than 10 characters being pasted?

http://jsfiddle.net/qfzkw/2/

解决方案

As stated, <textarea maxlength="10"> will work for a small amount of cases - but not all.

It is hard to determine how to prevent the user (in firefox for example) from entering the text area, selecting the browser menu Edit and then clicking on Paste. I am really at a loss for how to prevent that. You can check the keydown event to prevent ctrl + v. You can disable the context menu to disallow the right clicking of the text area (although a malicious user can edit the front end javascript and then re-enable this feature).

In short, there is no universal way to prevent user paste in a proper fashion.

However, you could hack a solution (always my favorite when it seems there is no way to continue on something you really want). This approach I am about to suggest is dependent on how many timers you have running. If you have multiple timers for animation, google suggests you try to fold them all into one timing unit which the others derive from. If this is the case, please refactor your timers.

Implement a global timer. Implement a function which runs ever 25ms based on that timer. Cache the contents of the textarea. See if those contents have changed.

textarea

<textarea id="maintextarea"></textarea>

script

/*init*/
var globalTimer = new Date();
var cachedText = document.getElementById("maintextarea").value;
var iterationCount = 0;

function cacheText() {
    cachedText = document.getElementById("maintextarea").value;
}

function upDateTimer() {
    globalTimer = new Date();
    var timerTimeout = setTimeout('upDateTimer()', 5);
    timeBasedOperations();
}
upDateTimer();

function timeBasedOperations() {
    iterationCount++;//this will allow timing to occur
    //TODO: Add in other timers calls based on global timer
    if (iterationCount % 5) {//every fifth iteration (hence 25ms)
        checkTextArea();
    }
}

function checkTextArea() {
    var currentText = document.getElementById("maintextarea").value;
    var textArea = document.getElementById("maintextarea");
    if (currentText.length > cachedText.length) {
        //TODO: Add additional logic for catching a paste or text change
        textArea.value = currentText.substr(0, 10);
    }
    cacheText();
}

I think although this implements a timer, this is a very practical solution. It also happens to work (tested).

:)

这篇关于Textarea charCount-防止用户粘贴的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆