自动选择text文字formutil.js

最新推荐文章于 2021-12-20 11:49:24 发布

lwsllm

最新推荐文章于 2021-12-20 11:49:24 发布

阅读量501

点赞数

分类专栏： Javascript 文章标签： function input textbox each

本文链接：https://blog.csdn.net/lwsllm/article/details/5716078

版权

Javascript 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

formutil.js

var FormUtil = new Object;

FormUtil.focusOnFirst = function () {
    if (document.forms.length > 0) {
        for (var i=0; i < document.forms[0].elements.length; i++) {
            var oField = document.forms[0].elements[i];
            if (oField.type != "hidden") {
                oField.focus();
                return;
            }
        }
    }
};

FormUtil.setTextboxes = function() {
    var colInputs = document.getElementsByTagName("input");
    var colTextAreas = document.getElementsByTagName("textarea");

    for (var i=0; i < colInputs.length; i++){
        if (colInputs[i].type == "text" || colInputs [i].type == "password") {
            colInputs[i].onfocus = function () { this.select(); };
        }
    }

    for (var i=0; i < colTextAreas.length; i++){
        colTextAreas[i].onfocus = function () { this.select(); };
    }
};

FormUtil.tabForward = function(oTextbox) {

var oForm = oTextbox.form;

    //make sure the textbox is not the last field in the form
    if (oForm.elements[oForm.elements.length-1] != oTextbox
        && oTextbox.value.length == oTextbox.maxLength) {

        for (var i=0; i < oForm.elements.length; i++) {
            if (oForm.elements[i] == oTextbox) {
                 for(var j=i+1; j < oForm.elements.length; j++) {
                     if (oForm.elements[j].type != "hidden") {
                         oForm.elements[j].focus();
                         return;
                     }
                 }
                 return;
            }
        }
    }
};

SelectTextExample.htm

<html>
    <head>
        <title>Select Text Example</title>
        <script type="text/javascript" src="formutil.js"></script>
    </head>
    <body οnlοad="FormUtil.setTextboxes()">
        <input type="text" size="12" id="txt1" value="initial value" /><br />
        <input type="text" size="12" id="txt1" value="another value" /><br />
        <input type="text" size="12" id="txt1" value="yet another value" /><br />
        <input type="text" size="12" id="txt1" value="and another value" /><br />
        <p>Try clicking or tabbing to each textbox. All the text will be selected.</p>
    </body>
</html>