用JS添加文本框案例代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>用JS添加文本框案例代码</title>
</head>

<body>
    <form id="t">
        <table id="table">
        <tr></td><input type="text" value="1" /></td></tr>
        <table>
        <input type="button" id="btn" value="提交" />
        <input type="button" id="new" value="新增" />
    </form>
    <script>
        document.getElementById(‘new‘).onclick = function(){
            var input = document.createElement(‘input‘);
            var tr = document.createElement(‘tr‘);
            var td = document.createElement(‘td‘);
            td.appendChild(input);
            tr.appendChild(td);
            document.getElementById(‘table‘).appendChild(tr);
        };
        document.getElementById(‘btn‘).onclick = function(){
            var inps = document.getElementsByTagName(‘input‘),
            len = inps.length,count = 0,arr = [];

            for(var i = 0; i < len; i++){
                if(inps[i].type == ‘text‘){
                    arr.push(inps[i]);
                }
            }

            for(var i = 0; i < arr.length; i++){
                if(inps[i].value != ‘‘){
                    count++;
                }else{
                    count--;
                }
            }

            if(count == arr.length){
                alert(‘提交‘)
                document.getElementById(‘t‘).submit();
            }else{
                alert(‘有空值‘)
            }
        };
    </script>
</body>
</html>
时间: 2024-12-30 04:22:08

用JS添加文本框案例代码的相关文章

jS实现文本框在点击时变色

jS实现文本框在点击时变色 网页上默认的文本框老是灰色风格,看的都有点不耐烦了,用CSS和JS改变其样式是大家都喜欢用的方法,今天写了一个点击边框变色的文本框,鼠标点击文本框将要输入的时候,文本框自动变色高亮显示,非常有视觉效果,让文本框变漂亮了许多.HTML代码如下: 01 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xh

点击扩展或缩小文本框效果代码

点击扩展或缩小文本框效果代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /><title>点击扩展或缩小文本框效果代码-蚂蚁部落</title><script type="te

Js控制文本框只能输入中文、英文、数字与指定特殊符号

JS 控制文本框只能输入数字<input onkeyup="value=value.replace(/[^0-9]/g,'')"onpaste="value=value.replace(/[^0-9]/g,'')" oncontextmenu ="value=value.replace(/[^0-9]/g,'')"> JS 控制文本框只能输入数字.小数点<inputonkeyup="value=value.replac

CodeMirror编辑器文本框Textarea代码高亮插件,CodeMirror的简单实用例子

CodeMirror是一个用于编辑器文本框textarea代码高亮javascript插件,为各种编程语言实现关键字,函数,变量等代码高亮显示,丰富的api和可扩展功能以及多个主题样式,能满足您各种项目的需求. 最近项目中要求把得到的后端json数据如下图展示给客户,还需要可编辑的功能,于是就用到了CodeMirror这款插件,经过初步的探索,发现它主题样式非常靓丽,简单美观,效果图如下: 下面我就一步一步说明我的使用过程. 1.首先需要下载codemirror插件,先创建文件夹,下载插件 np

JS控制文本框中的密码显示/隐藏功能

<html> <head> <title>[荐]JS控制文本框中的密码显示/隐藏功能_网页代码站(www.6a8a.com)</title> <style> body,input{font:menu} </style> </head> <body> <form method="POST" action="addcheck.asp" name="forms&

js 控制文本框只能输入中文、英文、数字等

总而言之:先在<input>里输入onkeyup="value=value.replace(/[^\X]/g,'')" 然后在(/[\X]/g,'')里的X换成你想输入的代码就可以了,中文u4E00-u9FA5,数字0-9,英文a-z\A-Z,其它符号@.点或其它符号.也可以多个,用\隔开就行了. 例如:中英文 + 数字 + @符号 + 点符号   \a-\z\A-\Z0-9\u4E00-\u9FA5\@\. 若想在文本框里不能右键弹出菜单和不能粘贴进复制的信息的话 就要在

JS 控制文本框只能输入中文、英文、数字与指定特殊符号

想做姓名输入的js判断是否是中文,但是网上找的很多是源于一篇文章的,判断中文的正则式不对,后来找到一个可以准确判断了,但是是监测里面有中文的就行,跟我想要的只能输入中文的意思相左,所以又找了下面的 JS 控制文本框只能输入数字 input onkeyup="value=value.replace(/[^0-9]/g,'')" onpaste="value=value.replace(/[^0-9]/g,'')" oncontextmenu = "value

纯 JS 设置文本框的默认提示

HTML5 中有个新特性叫 placeholder,一般用它来描述输入字段的预期值,适用于 text.search.password 等类型的 input 以及 textarea.示例如下: <input type="text" placeholder="请输入文本"><br> <input type="search" placeholder="请输入查询关键字"><br> &l

css设置input文本框样式代码实例

css设置input文本框样式代码实例:使用css设置input元素的样式是最为常用的操作之一,当然也是最为基础的操作,可能对于刚刚接触css的朋友还不够熟悉,下面就通过一段简单的代码历史演示一下如何设置文本框的样式,当然这个演示可能并不是特别的美观,这里的目的也只是起到一个演示作用,代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="