javascript实现的动态添加表单元素input,button等(appendChild)
写一个小系统时,需要动态添加表单元素,按自己的实现方法写了这篇教程!
我想各位在很多网站上都看到过类似的效果!
1、先用document.createElement方法创建一个input元素!
2、设定相关属性,如name,type等
newInput.name="input1";
3、用appendChild方法,将元素追加到某个标签内容中!
Javascrip核心代码:
function AddElement(mytype){
var mytype,TemO=document.getElementById("add");
var newInput = document.createElement("input");
newInput.type=mytype;
newInput.name="input1";
TemO.appendChild(newInput);
var newline= document.createElement("br");//创建一个BR标签是为能够换行!
TemO.appendChild(newline);
}
</script>
我想各位在很多网站上都看到过类似的效果!
1、先用document.createElement方法创建一个input元素!
2、设定相关属性,如name,type等
newInput.name="input1";
3、用appendChild方法,将元素追加到某个标签内容中!
Javascrip核心代码:
function AddElement(mytype){
var mytype,TemO=document.getElementById("add");
var newInput = document.createElement("input");
newInput.type=mytype;
newInput.name="input1";
TemO.appendChild(newInput);
var newline= document.createElement("br");//创建一个BR标签是为能够换行!
TemO.appendChild(newline);
}
</script>
javascript实现的动态添加表单元素input,button等(appendChild)的更多相关文章
- 动态增加表单元素并获取元素的text和value提交
以上是效果图 需求是这样的: 专家设置好条件,然后设备检测到达到相应的条件之后,设备发出提醒给用户. 这就需要专家设置好能看懂的条件之后,然后把给专家看的,正常人能看懂的条件和发送的设备的,设备能够识 ...
- js 动态添加表单 table tr
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue教程1-01 v-model 一般表单元素(input) 双向数据绑定
vue教程1-01 v-model 一般表单元素(input) 双向数据绑定el:'#box',//这里放的是选择器.不然会不生效 <!DOCTYPE html> <html l ...
- JavaScript 学习(2)表单元素
##JavaScript 学习-2 1. 表单和表单元素 1.1 form对象 form对象的引用:document.forms[0]或者引用name属性,如:document.forms[" ...
- jquery动态添加表单数据
动态添加用户 实现代码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html ...
- vue 使用 element ui动态添加表单
html部分 <div class="hello"> <el-form :model="dynamicValidateForm" ref=&q ...
- easy ui 表单元素input控件后面加说明(红色)
<%-- 上传图片到图库基本信息且将图片关联到图集 开始--%> <div id="win_AddPicLib" class="easyui-windo ...
- bootstrap如何把表单select input button弄在一行
bootstrap很多折叠样式css都已经写好,可以直接用,很方便.但是,如果遇到一些bootstrap文档里面没有的例子,估计很多初学者都懵了,然后会折腾很久也未见得有效.今天主要讲如何把selec ...
- ajax验证表单元素规范正确与否 ajax展示加载数据库数据 ajax三级联动
一.ajax验证表单元素规范正确与否 以用ajax来验证用户名是否被占用为例 1创建表单元素<input type="text" id="t"> 2 ...
随机推荐
- Java - String中的==、equals及StringBuffer(转自CSDN 作者:chenrui_)
equals是比较值/对象是否相同,==则比较的是引用地址是否相同. == 如果是基本类型则表示值相等,如果是引用类型则表示地址相等即是同一个对象 package com.char3; public ...
- Tensorflow样例代码分析cifar10
github地址:https://github.com/tensorflow/models.git 本文分析tutorial/image/cifar10教程项目的cifar10_input.py代码. ...
- Robot Framework(AutoItLibrary库关键字介绍)
AutoItLibrary库关键字 AutoItLibrary 的对象操作大体上有几大主要部分,Window 操作.Control 操作.Mouse 操作.Process操作.Run 操作.Reg 操 ...
- SSH框架学习步骤
Hibernate 对象状态 关系映射 SQL语句 缓存抓取 struts action的分发配置 参数传递 文件上传 spring IOC AOP
- poj 3750 小孩报数问题
小孩报数问题 Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 11527 Accepted: 5293 Descripti ...
- Javascript替代eval方法
Javascript替代eval方法 通常我们在使用ajax获取到后台返回的json数据时,都要使用 eval 这个方法将json字符串转换成对象数组, 像这样: obj = eval('('+dat ...
- JSON跨域问题总结
一.跨域问题的原因: 1 浏览器的检查 2 跨域 3 XMLHttpRequest请求二.跨域问题的解决: 1 禁止浏览器检查:使用dos命令,在启动浏览器的时候,加一个参数:chrome --dis ...
- Java基础(十二)IO输入输出
一.IO 概述 1.IO 概念 IO:I 代表 Input 输入:O 代表 Output 输出. Java 中 IO 是以流为基础进行输入输出,所有的数据被串行化(保存)写入输出流,或者从输入流读入. ...
- 流畅的python和cookbook学习笔记(八)
1.函数的默认参数必须不可变 如果函数的默认参数为可变的对象,那么默认参数在函数外被修改也会影响到函数本身的. >>> def spam(a, b=None): # b要为不可变参数 ...
- springboot自定义异常
SpringBoot自定义异常以及异常处理 在web项目中,我们可能需要给前端返回不同的提示码.例如:401表示没有权限,500代表位置异常,200代表请求成功等.但是这些提示码远远不能满足我们返回给 ...