脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → js获取文本框内容

利用js实现前台动态添加文本框,后台获取文本框内容(示例代码)

 更新时间：2013年11月25日 09:45:14   投稿：jingxian  
这篇文章主要是对利用js实现前台动态添加文本框,后台获取文本框内容的示例代码进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助

一共两个页面，分别如下：

一.创建页面create.jsp

复制代码 代码如下:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<title>
</title>
<head>
</head>
<body >
 <form id="form1" action="request.jsp">
<script language="javascript" type="text/javascript">

var count=0 ;
function additem(id)
{
  var row,cell,str;
  row = document.getElementByIdx_x(id).insertRow();
  if(row != null )
  {
cell = row.insertCell();
cell.innerHTML="<input id=\"St"+count+"\" type=\"text\" name=\"St"+count+"\" value= \"St"+count+"\"><input type=\"button\" value=\"删除\" onclick=\'deleteitem(this);\'>";
count ++;
  }
}
function deleteitem(obj)
{
  var curRow = obj.parentNode.parentNode;
  tb.deleteRow(curRow.rowIndex);
}

function getsub()
{
var re="";
for (var  i = 0 ;i<count;i++)
{
re += document.getElementsByName("St"+i)[0].value;

}
document.getElementByIdx_x("Hidden1").value=re;
}


</script><table id="tb"></table>
<input name="button" type="button" onclick='additem("tb")' value="添加>>"/><input type="submit" name="submit" onclick="getsub()" value="提交"/>
    <input id="Hidden1" name="Hidden1" type="hidden" value="" />
    </form>
</body>

</html>


二.接收数据页面 request.jsp
复制代码 代码如下:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<html>
  <head>
 
    <title>测试</title>

  </head>
  <%
   String data= request.getParameter("Hidden1");
   out.println("取得的数据为："+data);
   %>
  <body>
 
  </body>
</html>

相关文章

  • uniapp实现滚动触底加载项目实战

    uniapp实现滚动触底加载项目实战

    这篇文章主要为大家介绍了uniapp实现滚动触底加载项目实战方法详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2023-09-09
  • JavaScript实现HTML导航栏下拉菜单

    JavaScript实现HTML导航栏下拉菜单

    这篇文章主要为大家详细介绍了JavaScript实现HTML导航栏下拉菜单，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2020-11-11
  • 微信小程序实现省市区三级地址选择

    微信小程序实现省市区三级地址选择

    这篇文章主要为大家详细介绍了微信小程序实现省市区三级地址选择，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2018-11-11
  • 调用js时ie6和ie7，ff的区别

    调用js时ie6和ie7，ff的区别

    主要考虑到一些浏览器的兼容性问题，这个是经常遇到的，大家可以参考下。
    2009-08-08
  • BootStrap数据表格实例代码

    BootStrap数据表格实例代码

    本文通过实例代码给大家分享了BootStrap数据表格的相关知识，感兴趣的朋友一起看看吧
    2017-09-09
  • js实现日期天数、时分秒的倒计时完整代码

    js实现日期天数、时分秒的倒计时完整代码

    这篇文章主要给大家介绍了关于js实现日期天数、时分秒的倒计时的相关资料,实现倒计时功能首先是得到目标时间,然后用当前时间减去目标时间,最后将时间差传化为天数、时、分、秒,需要的朋友可以参考下
    2023-11-11
  • 微信小程序movable view移动图片和双指缩放实例代码

    微信小程序movable view移动图片和双指缩放实例代码

    movable-area是微信小程序的新组件，可以用来移动视图区域movable-view。这篇文章主要介绍了微信小程序movable view移动图片和双指缩放实例代码,需要的朋友可以参考下
    2017-08-08
  • 基于prototype扩展的JavaScript常用函数库

    基于prototype扩展的JavaScript常用函数库

    基于prototype扩展的JavaScript常用函数库实现代码，学习js的朋友可以参考下。
    2010-11-11
  • js实现视图和数据双向绑定的方法分析

    js实现视图和数据双向绑定的方法分析

    这篇文章主要介绍了js实现视图和数据双向绑定的方法,结合实例形式分析了vue.js及jQuery数据绑定相关操作技巧与注意事项,需要的朋友可以参考下
    2020-02-02
  • javascript 选择文件夹对话框(web)

    javascript 选择文件夹对话框(web)

    web程序开发中经常会遇见选择文件夹的时候，这对于web程序员是一件麻烦的事情，由于本地安全限制JS不能访问本地文件，所以选择文件夹一般都避而不谈，笔者在写一个程序的时候也遇见了同样的问题，开始尝试使用JS来遍历文件，结果都没有成功
    2009-07-07

最新评论