有意思的代码片段

1.表单禁止输入

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript表单禁止输入</title>
</head>
<body>
    <form action="#">
        <input type="text">禁止输入<br>
        <input type="text">请输入<br>
        <input type="text">请输入
    </form>
    <script>
        var input = document.getElementsByTagName('input')[0];
        input.onfocus = function() {
            this.blur();
        }
    </script>
</body>
</html>

 

2.禁止用户复制粘贴

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>禁止复制粘贴</title>
</head>
<body>
    <p>我是一段不可复制的文本</p>
    <form action="#">
        <textarea name="text" id="text" cols="30" rows="10" placeholder="在我的区域内不允许粘贴"></textarea>
    </form>
    <script>
        var p = document.getElementsByTagName('p')[0],
            textarea = document.getElementsByTagName('textarea')[0];
        p.oncopy = function() {
            return false;
        }
        textarea.onpaste = function() {
            return false;
        }
    </script>
</body>
</html>

 

3.光标停留在文字最后

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>光标停留在文字最后</title>
    <style>
        input {
            width: 60%;
        }
    </style>
</head>
<body>
    <p>我的光标永远停留在文字最后</p>
    <input type="text" value="我是一段文字，光标会在我之后停留。">
    <script>
        var input = document.getElementsByTagName('input')[0];
        input.onclick = input.onkeyup = function() {
            var length = this.value.length;

            if (this.setSelectionRange) {
                //非IE浏览器
                this.setSelectionRange(length,length);
            }
            else {
                //IE浏览器
                var range = this.createTextRange();
                range.moveStart('character',length);
                range.collapse(true);
                range.select();
            }
        };
    </script>
</body>
</html>

 

posted @ 2016-08-19 16:39  libinfs  阅读(263)  评论(0)  编辑  收藏  举报