zl程序教程

您现在的位置是:首页 >  其他

当前栏目

html 监听文本框输入

输入HTML 监听 文本框
2023-09-27 14:27:48 时间
<!DOCTYPE html>
<html>
<head>
    <meta charset="gbk"/>
    <title>监听文本框输入</title>
</head>
<body>
<input type="text" value="" id="io" />
<p id="dis"></p>
<script type="text/javascript">
    // 监听文本框输入
    var input = document.getElementById("io");
    var dis = document.getElementById("dis");
    function fn() {
        // 你要执行的代码
        dis.innerHTML =input.value ;
    }
    if(window.addEventListener) { //W3C
        input.addEventListener("input", fn, false);
    }
    else if(window.attachEvent) { //IE
        input.attachEvent("onpropertychange", fn);
    }
    if(window.VBArray && window.addEventListener) { //IE9
        input.attachEvent("onkeydown", function() {
            var key = window.event.keyCode;
            if ((key == 8 || key == 46) && input.value != '') fn(); //处理回退与删除
        });
        input.attachEvent("oncut", fn);//处理剪切
    }



</script>
</body>
</html>