JS动态添加表单

<script type=”text/javascript”>
function addRow()<!–js实现添加一行内容!–>
{
var tr=document.createElement(“tr”);
var td=document.createElement(“td”);
var input=document.createElement(“input”);
input.setAttribute(“type”,”file”);
input.setAttribute(“name”,”image[]”);
td.appendChild(input);
tr.appendChild(td);
var td2=document.createElement(“td”);
var inputs=document.createElement(“input”);
inputs.setAttribute(“type”,”button”);
inputs.setAttribute(“value”,”+”);
inputs.setAttribute(“onclick”,”addRow()”);
td2.appendChild(inputs);
tr.appendChild(td2);
var td3=document.createElement(“td”);
var inputs1=document.createElement(“input”);
inputs1.setAttribute(“type”,”button”);
inputs1.setAttribute(“value”,”-“);
inputs1.setAttribute(“onclick”,”del()”);
td3.appendChild(inputs1);
tr.appendChild(td3);
document.getElementById(“tbody”).appendChild(tr);
}
function del()                                           <!–js实现删除一行内容!效果如下图所示–!>
{
var tr=document.getElementById(“tbody”);
var td=tr.lastChild;
tr.removeChild(td);
}
</script>
<form action=”#” method=”post” enctype=”multipart/form-data” name=”frm1″>
<input type=”file” name=”image[]” value=””/>
<input type=”button” value=”+” onclick=”addRow()”/>
<input type=”button” value=”-” onclick=”del()” />
<div id=”tbody”></div>
<input type=”submit” value=”提交” onclick=”submit”/>
<input type=”reset” value=”重置 “/>
</form>

原文:http://lizongwei.blog.163.com/

下面部分是点击按钮显示隐藏内容,加红色部分是关键代码

<input type=”button” value=”跳转网址” onClick=”document.getElementById(‘redirecturl’).style.display=’block'”>

下面的tr或者div中关键的部分是加红色的

<tr id=”redirecturl” bgcolor=”#FFFFFF” style=”display:none;”>

<td width=”90″ align=”center”>&nbsp;跳转网址</td>

<td colspan=”2″><input name=”redirecturl” type=”text” id=”redirectUrl” style=”width:300px” value=”<?php echo $info[‘url’];?>”/>&nbsp;注意:此处必须以 <font color=”red”>http://</font> 开头</td>     </tr>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏钱塘大数据

中国互联网协会发布:《2018中国互联网发展报告》

在2018中国互联网大会闭幕论坛上,中国互联网协会正式发布《中国互联网发展报告2018》(以下简称《报告》)。《中国互联网发展报告》是由中国互联网协会与中国互联...

13250
来自专栏微信公众号:小白课代表

不只是软件,在线也可以免费下载百度文库了。

不管是学生,还是职场员工,下载各种文档几乎是不可避免的,各种XXX.docx,XXX.pptx更是家常便饭,人们最常用的就是百度文库,豆丁文库,道客巴巴这些下载...

43230
来自专栏怀英的自我修炼

考研英语-1-导学

英二图表作文要重视。总体而言,英语一会比英语二难点。不过就写作而言,英语二会比英语一有难度,毕竟图表作文并不好写。

11310
来自专栏FSociety

SQL中GROUP BY用法示例

GROUP BY我们可以先从字面上来理解,GROUP表示分组,BY后面写字段名,就表示根据哪个字段进行分组,如果有用Excel比较多的话,GROUP BY比较类...

5.1K20
来自专栏钱塘大数据

理工男图解零维到十维空间,烧脑已过度,受不了啦!

让我们从一个点开始,和我们几何意义上的点一样,它没有大小、没有维度。它只是被想象出来的、作为标志一个位置的点。它什么也没有,空间、时间通通不存在,这就是零维度。

26830
来自专栏haifeiWu与他朋友们的专栏

复杂业务下向Mysql导入30万条数据代码优化的踩坑记录

从毕业到现在第一次接触到超过30万条数据导入MySQL的场景(有点low),就是在顺丰公司接入我司EMM产品时需要将AD中的员工数据导入MySQL中,因此楼主负...

26540
来自专栏腾讯高校合作

【倒计时7天】2018教育部-腾讯公司产学合作协同育人项目申请即将截止!

15220
来自专栏腾讯社交用户体验设计

ISUX Xcube智能一键生成H5

50820
来自专栏Ken的杂谈

【系统设置】CentOS 修改机器名

17230
来自专栏前端桃园

知识体系解决迷茫的你

最近在星球里群里都有小伙伴说道自己对未来的路比较迷茫,一旦闲下来就不知道自己改干啥,今天我这篇文章就是让你觉得一天给你 25 个小时你都不够用,觉得睡觉都是浪费...

19440

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励