利用javascript增加form的input

這是js的部份

//用來區分不同input的name
var element_count = 0; function add_element(obj)
{
element_count++;
//先建立一個input的tag
var new_element = document.createElement("input");
//設定這個input的屬性
//可以這樣用
new_element.type = "text";
new_element.name = "new" + element_count;
new_element.value = element_count;
//也可以這樣用
new_element.setAttribute("type","text");
new_element.setAttribute("name","new" + element_count);
new_element.setAttribute("value",element_count);
//最後再使用appendChild加到要加的form裡
obj.form.appendChild(new_element);
//換行用~ 一樣是要加到form裡
var s = document.createElement("br");
obj.form.appendChild(s);
}

這是html的部份

<form name="myform">
<input type="button" value="增加input" onclick="add_element(this)"><br />
</form>

转:[web]javascript 增加表單的input的更多相关文章

  1. Flask從入門到入土(三)——Web表單

    Flask-WTF擴展可以把處理Web表單的過程變成一種愉悅的體驗.這個擴展對獨立的WTForms包進行了包裝,方便集成到Flask程序中. Flask-WTF及其依賴可使用pip安裝: pip in ...

  2. JavaScript常用表单验证正则表达式(身份证、电话号码、邮编、日期、IP等)

    身份证正则表达式 //身份证正则表达式(15位)isIDCard1=/^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$/;//身份证正则表达式 ...

  3. ajax form表单提交 input file中的文件

    ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

  4. HTML表单之input元素的23种type类型

    摘自:http://www.cnblogs.com/xiaohuochai/p/5179909.html 了解HTML表单之input元素的23种type类型 随着HTML5的出现,input元素新增 ...

  5. 了解HTML表单之input元素的30个元素属性

    目录 传统属性 name type accept alt checked disabled readonly maxlength size src value 新增属性 autocomplete au ...

  6. web网页的表单排版利器--960css

    表单排版样式 960css 前言 一般web网页的表单排版,大家都习惯用table排版,自己需要根据实际需要去定义TR和TD,很多时候对于TD的高宽度.是否合并行,合并列,都要去做一些处理,这些都是比 ...

  7. [MVC4-基礎] 使用DataAnnotations+jQuery進行表單驗證

    我目前有以下表單,Select部分因為必須上一層有選擇下層才有資料,因此使用jQuery驗證問題類型是否有選擇就好,而問題描述要驗證是否為空,這裡採用MVC內建的DataAnnotations來驗證. ...

  8. vue表單

    使用v-model進行表單雙向數據綁定. 可以根據控件決定數據的類型,可以綁定input.單選.複選.下拉框等 可以使用number和trim等修飾符.

  9. 项目总结15:JavaScript模拟表单提交(实现window.location.href-POST提交数据效果)

    JavaScript模拟表单提交(实现window.location.href-POST提交数据效果) 前沿 1-在具体项目开发中,用window.location.href方法下载文件,因windo ...

随机推荐

  1. Linux环境下安装XAMPP的PHP的PDF扩展

    安装pdf扩展1. wget http://pecl.php.net/get/pdflib-4.1.2.tgz2. tar zxvf pdflib-4.1.2.tgz3. cd pdflib-4.1. ...

  2. 简述FPGA的一些优势

    优势一: 更大的并行度.这个主要是通过并发和流水两种技术实现. A:并发是指重复分配计算资源,使得多个模块之间可以同时独立进行计算.这一点与现在的多核和SIMD技术相似.但相对与SIMD技术,FPGA ...

  3. 【转】Jmeter基础之——jmeter基础概念

    JMeter 介绍:一个非常优秀的开源的性能测试工具. 优点:你用着用着就会发现它的重多优点,当然不足点也会呈现出来. 从性能工具的原理划分: Jmeter工具和其他性能工具在原理上完全一致,工具包含 ...

  4. 【转】关于一个Jmeter interface testing的实例

    目标:测试某个保险系统的费率接口 准备:a 请求方式:Http b 接口地址://10.1.1.223:9090/rulesEngine/executeRateRule.do Jmeter 设置: a ...

  5. Excel开发学习笔记:查找与创建worksheet

    开发环境基于VSTO,具体配置:visual studio 2010,VB .Net,excel 2007,文档级别的定制程序. 如题,我在ThisWorkbook.vb中添加了一个public函数来 ...

  6. 使用Docker模拟ansible集群环境

     /etc/ansible/hosts 192.168.99.100 ansible_ssh_port=8081 ansible_ssh_user=root 配置容器免密码SSH登录

  7. js操作一般文件和csv文件

    js操作一般文件和csv文件 将文本文件读成字符串 <input type="file" id="upload"> document.getElem ...

  8. activemq安装运行及其在springboot中的queue和topic使用

    安装activemq 运行 springboot使用 依赖 配置 Producer Consumer ComsumerTopic 使用 安装activemq http://activemq.apach ...

  9. js 判断浏览器类型大全

    /**** * 目前识别范围 * Microsoft Internet Explorer IE浏览器 * --> TheWorld 世界之窗 * --> TT浏览器 * --> 36 ...

  10. 「小程序JAVA实战」微信小程序简介(一)

    转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-01/ 一直想学习小程序,苦于比较忙,加班比较多没时间,其实这都是理由,很多时候习惯了搬砖,习惯了固 ...