<!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点击添加input输入框</title>

<script type="text/javascript">
/****添加新条目***/
/******点击添加input输入框JS******/
function checkRowsLimit()
{
var rowLimit = 10;
var len=document.getElementById('filearea').rows.length;
if(len==rowLimit)
{
alert('抱歉，为了您主页美观，只能添加这么多条目了。');
return false;
}
else
{
return true;
}
}

function addNewRow()
{
var obj=document.getElementById('filearea');

var row=obj.insertRow(-1);
var c0=row.insertCell(0);
c0.innerHTML='<input type=text size="3" maxlength=8 name="question" value="" onpropertychange=changeFlagValue()> ：';
c0.align='right';

var c1=row.insertCell(1);
c1.innerHTML='<input type=text size=50 maxlength=50 name="answer" style="margin-left:1px;" value="" onpropertychange=changeFlagValue()>';
c1.align='left';

var c2=row.insertCell(2);
c2.innerHTML='<a href="javascript:void(0)" onclick="removeRow(this)">[删除]</a>';
changeFlag = true;
try
{
comm_set_page_height();
}
catch (e)
{
}
}
function removeRow(fontobj)
{
if(confirm("确定取消该项吗?"))
{
var obj=document.getElementById('filearea');
var n=fontobj.parentNode.parentNode.rowIndex;
obj.deleteRow(n);
}
}</script>
</head>
<body>
<table width="735" border="0" id="filearea">
<tr>
<td align=right>商品编号<input type="text" onpropertychange=changeFlagValue() maxLength=8 size=3 name=question /> ：</td>
<td align=left><input type="text" style="MARGIN-LEFT: 1px"
onpropertychange=changeFlagValue() maxLength=50 size=50 name=answer /></td>
<td><a href="#" onClick="if(checkRowsLimit()) {addNewRow();changeFlag=true}" title="点击后在上面添加的输入框">[添加条目]</a></td>
</tr>
</table>
</body>
</html>

使用js实现input输入框的增加的更多相关文章

  1. js判断input输入框为空时遇到的问题 弹窗后，光标没有定位到输入框，而是直接执行我的处理页面程序

    无论是会员注册还是提交订单,我们都要使用到form表单,此时我们在处理数据时,就要判断用户填写的信息.一次是直接通过js判断input输入框是否没有填信息,然后在后台处理文件中通过过滤字符串后再次判断 ...

  2. js验证input输入框（字母，数字，符号，中文）

    [javascript]代码库 <h1>js验证输入框内容</h1> <br /> <br /> 只能输入英文 <input type=" ...

  3. js 验证input 输入框

    <h1>js验证输入框内容</h1><br /><br /> 只能输入英文<input type="text" onkeyup ...

  4. js实现input输入框只能输入数字的功能（完美测试通过）

    <input type="text" style="ime-mode:disabled;" onpaste="return false;&quo ...

  5. js格式化input输入框内容（每几位分一组，并使用特定字符分隔）

    <html> <head> <title></title> </head> <body> <input id=" ...

  6. 【JS】input输入框只能输入数字

    一.实现思路 input只能输入纯数字的思路其实很简单,监听输入框值的变化,每次输入检索输入框的值,将非数字的字段替换成空,再将此值赋予给输入框. 关键代码: \d:匹配数字 ^/d:全文匹配非数字 ...

  7. Html+js 控制input输入框提示

    <input type="text" class="fl plsearch_txt" id="key" value="请输入 ...

  8. JS 改变input 输入框样式

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  9. js实现input输入框只能输入数字的功能

    <input type="text" style="ime-mode:disabled;" onpaste="return false;&quo ...

随机推荐

  1. HTTP 错误 500.21 - Internal Server Error

    HTTP 错误 500.21 - Internal Server Error 处理程序“PageHandlerFactory-Integrated”在其模块列表中有一个错误模块“ManagedPipe ...

  2. js中转移符

    "<a href='javascript:;' onclick='javascript:changeChannelRuleStatus(\"" + options. ...

  3. oracle initialization or shutdown in progress解决方法

    [解决方法]   SQL> connect sys/hope as sysdba 已连接. SQL> shutdown normal ORA-01109: 数据库未打开     已经卸载数 ...

  4. PDF 补丁丁 0.5.0.2273 测试版发布：修复崩溃问题，可自定义工具栏文本

    新的测试版修复了编辑器在打开文件后再打开文件会崩溃的严重错误,以及一些小问题. 在一些小细节上作了调整,例如可自定义常用工具栏的文本等等. 由于之前测试版本的错误比较严重,推荐网友下载新的测试版.

  5. UVA 11624 Fire!

    题目大意: F代表火焰 J代表人 一个人想在火焰烧到自己之前逃出着火地区 . 为路,人可以走,火可以燃烧(当然如果火先烧到就不能走了) #为墙,不可走 如果能逃出,输出时间,不能,输出IMPOSSIB ...

  6. CentOS 6.7 中安装Emacs 24.5

    Emacs 版本:http://mirror.bjtu.edu.cn/gnu/emacs/emacs-24.5.tar.gz CentOS 内核版本:2.6.32-573.el6.x86_64 参考资 ...

  7. 自定义动画css属性

    自定义动画: 1.animation-name(自定义动画名称) 元素所应用的动画名称,必须与@keyframes使用,名称由@keyframes定义. keyframes(动画关键帧):以@keyf ...

  8. Windows7 安装vs2015 之后 调试Web项目IIS启动不了 aspnetcore.dll未能加载

    安装windows企业版,整整折腾了两天了,一个本身家里网络环境不好,时不时掉线,终于披荆斩棘,克服了所有困难,结果VS2015 EnterPrise 版本在调试Web环境的时候,始终在任务栏里找不到 ...

  9. https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform

    https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform

  10. Bootstrap<基础二十七> 多媒体对象（Media Object）

    Bootstrap 中的多媒体对象(Media Object).这些抽象的对象样式用于创建各种类型的组件(比如:博客评论),我们可以在组件中使用图文混排,图像可以左对齐或者右对齐.媒体对象可以用更少的 ...