利用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. codeforces 985 D. Sand Fortress(二分+思维)

    Sand Fortress time limit per test 2 seconds memory limit per test 256 megabytes input standard input ...

  2. 1032 Sharing

    题意:寻找两个链表的首个公共结点,输出其地址. 思路: 方法1.  如果LinkList1比LinkList2长,则让LinkList1先偏移(len1-len2)个结点,然后,让两个链表的的工作指针 ...

  3. logging模块讲解

    logging模块 很多程序都有记录日志的需求,并且日志中包含的信息即有正常的程序访问日志,还可能有错误.警告等信息输出,python的logging模块提供了标准的日志接口,你可以通过它存储各种格式 ...

  4. PHP通过引用传递参数

    <?php function add_some_extra(&$string) // 引入变量,使用同一个存储地址 { $string .= 'and something extra.' ...

  5. 关于 NULL的坑

    有如下的表: select * from testtable where name in ('name'):  结果是第一条: select * from testtable where name n ...

  6. 整合多个py文件接口的unittest。suite执行方法

    1.每个接口用例为一个.py文件.内容如下: getAdMakeMoneyList文件: # coding=utf-8import xlrdimport requestsimport unittest ...

  7. select 设置发送超时发送注意事项

    //设置发送超时你只发送, 并发送足够多的数据以填满发送缓冲区, 接收端一直不接收.发送端一量满发送缓冲区就会阻塞, 如果你设置了发送超时, 超时到了它就会返回发送超时了. 在send(),recv( ...

  8. leetcode811

    class Solution { public: void SplitString(const string& s, vector<string>& v, const st ...

  9. Centos7下快速安装Mongo3.2

    Centos7下快速安装Mongo3.2 一般安装Mongo推荐源码安装,有时候为了快部署测试环境,或者仅仅是想装个mongo shell,这时候yum安装是最合适的方式, 下面介绍一下如何在Cent ...

  10. ubuntu主目录下的中文文件夹名改回英文

    linux下经常用命令行,目录有中文输起来非常麻烦,想把他改回英文于是登录的时候选择英文发现没装英文语言环境,为这个重新装麻烦,只能再想办法 找了一下发现传话里有个用户文件夹更新,命令是xdg-use ...