<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My JSP 'uploadpic.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<style>
#tab td{
font-size: 12px;
}
.td1{
border-bottom: 1px solid #E1E1E1;
padding: 3px;
}
.td2{
border-right: 1px solid #E1E1E1;
}
</style>
</head>
<script type="text/javascript">
function trim(str)
{
var par = /^\s+/;
var strRes = str.replace(par,'');
par = /\s+$/;
strRes = strRes.replace(par,'');
return strRes;
}
function mysubmit()
{
var fpic=document.getElementsByName("fpic");
for(var i=0;i<fpic.length;i++)
{
if(fpic[i].value=="")
{
alert("?腢猁奻腔");
return false;
}
var pic=fpic[i].value.substring(fpic[i].value.length-3).toUpperCase();
if(trim(pic)== "JPG"||trim(pic)=="GIF")
{
}else
{
alert ("?腢JPG﹜GIF跡宒腔奻");
return false;
}
}
document.myfrom.action="upload_save.jsp";
}
</script>
<body >
<form action="" onSubmit="return mysubmit();" name="myfrom" method="post" enctype="multipart/form-data">
<input type="hidden" name="fid" value=""/>
<table width="100%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td valign="top" height="" style="padding-left: 0px; padding-top: 0px;">
<table id="tab" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td class="td1 td2">描述</td>
<td class="td1 td2">备注</td>
<td class="td1 td2">文件路径</td>
<td class="td1 td2">是否发布</td>
<td class="td1">操作</td>
</tr>
<tr>
<td><input name="fdesc" style="width: 200px;"/></td>
<td><input name="fremark" style="width: 200px;"/></td>
<td><input type="file" style="width: 200px" name="fpic"/></td>
<td align="center"><input type="checkbox" onClick='mychange(this)' name="fpublish" checked="checked" value="1"/><input name="fpublish1" value="1"/ type="hidden"></td>
<td>
<input type="button" style="width: 80px" onClick="myAddRow()" value="添加列"/></td>
</tr>
</table>
</td>
<tr>
<td align="center"><br/><input type="submit" style="width: 80px" value="上传"/></td>
</tr>
<tr><td height="6" background="../styles/advanced/images/section/td1_bottom.gif"></td></tr>
</table> </td>
<td width="7" background="../styles/advanced/images/section/section_middle_right.gif"></td>
</tr>
</table>
</td>
</tr>
</table>
</form>
<script type="text/javascript">
function myAddRow()
{
var tr=tab.insertRow();
var td=tr.insertCell();
td.innerHTML="<input name='fdesc' style='width: 200px'/>";
td=tr.insertCell();
td.innerHTML="<input name='fremark' style='width: 200px'/>";
td=tr.insertCell();
td.innerHTML="<input type='file' style='width: 200px' name='fpic'/>";
td=tr.insertCell();
td.align="center";
td.innerHTML="<input type='checkbox' onClick='mychange(this)' checked='checked' name='fpublish' value='1'/><input name='fpublish1' type='hidden' value='1'/>";
td=tr.insertCell();
td.innerHTML="<input type='button' style='width: 80px' onclick='myDeleteRow(this)' value='Delete'/>";
}
function myDeleteRow(btn)
{
btn.parentNode.parentNode.removeNode(btn);
}
function mychange(btn)
{
if(btn.checked==true)
{
btn.parentElement.children[1].value="1";
}else
{
btn.parentElement.children[1].value="0";
}
}
</script>
</body>
</html>
分享到：
相关推荐
在"动态添加表单"这个主题中，我们将深入探讨如何在ExtJS中实现表单的动态创建和管理。 首先，我们要理解表单（Form）在ExtJS中的基本概念。表单是数据输入和验证的核心组件，可以包含各种字段类型，如文本框、下拉...
**AngularJS 动态添加表单** AngularJS 是一个强大的前端JavaScript框架，它极大地简化了构建交互式Web应用的过程。动态添加表单是AngularJS中一个重要的特性，它允许开发者在用户交互时动态地向页面中添加或移除...
首先，要动态添加表单，我们需要引入jQuery库。这通常通过在HTML文件的`<head>`部分添加一个`<script>`标签来完成，指定jQuery的CDN链接： ```html <script src="https://code.jquery.com/jquery-3.6.0.min.js"></...
微信小程序动态添加一个表单模块，直接拷贝就能使用 动态添加组件 里面用到了TDesign外部框架，需要npm install 一下 很多项目都通用的功能，动态添加的view包含，input、datepikcer，checkBox多项内容 案例可借鉴性...
一、动态添加表单元素 1. 创建新元素：首先，我们需要使用JavaScript创建新的HTML元素。例如，如果要添加一个文本输入框，可以使用`document.createElement('input')`来创建一个`<input>`标签。接着，可以通过`...
v-for指令基于一个数组生成对应数量的DOM结构，这意味着可以预先设置一个基本的表单模板，然后通过数组来控制模板的复制次数，最终实现动态添加表单的需求。 知识点四：表单验证方法 在Vue.js中，Element UI支持了...
动态添加表单是Web开发中常见的一种功能，它允许用户在运行时根据需求自定义或增加表单元素，为用户提供更灵活的交互体验。在网页设计中，这种技术尤其适用于数据输入多变或者需要用户自由组合信息的情况。下面将...
在实际应用中，往往需要支持用户在表单中动态添加或删除字段。Vue的数组操作方法（如push、pop、splice等）可以帮助我们轻松地管理表单数据的增删。同时，el-form和el-table可以实时响应数据变化，实现视图的同步...
2. **JavaScript**：JavaScript是一种客户端脚本语言，用于处理网页中的交互和动态效果。在动态增加表单元素时，JavaScript发挥关键作用。例如，你可以使用`document.createElement()`创建新的`<input>`元素，然后...
2. **AJAX交互**：为了实现不刷新页面的动态添加和删除，通常会结合使用JavaScript或jQuery。jqGrid插件提供API，使得通过AJAX请求与服务器进行数据交换变得简单。当你需要添加新行或删除现有行时，可以向PHP发送...
2. **Iview组件库**：Iview提供了一系列与表单相关的组件，如Input、Select、Checkbox、Radio等，这些组件可以直接在Vue模板中使用，并能与Vue的数据绑定机制无缝集成。动态表单可以通过循环遍历JSON布局，动态生成...
在JavaScript编程中，动态添加表单是一项常见的需求，特别是在构建具有高度交互性和可扩展性的Web应用时。通过动态创建和管理表单元素，开发者可以轻松应对用户可能的需求变化，实现XML数据的加载和显示，从而增强...
2. **动态生成**：组件可以根据传入的数据动态生成相应的输入控件，如文本框、选择器、开关等。 3. **验证功能**：提供强大的表单验证功能，可以自定义验证规则，确保用户输入的数据满足业务要求。 4. **表单操作*...
因此，当你试图通过`innerHTML`获取这些动态添加表单的值时，可能会得到空值或者预期之外的结果。 解决这个问题的一种方法是直接通过DOM API来访问和操作动态表单元素。例如，如果你有一个输入框`<input>`，你可以...
二、动态添加表单元素 在JavaScript中，我们可以利用DOM（文档对象模型）API来动态创建和插入HTML元素。例如，当用户点击“添加新事项”按钮时，可以通过以下步骤创建一个新的表单行： 1. 创建新的`<li>`元素，...
Bootstrap动态表单是一种高效、灵活的用户界面设计方式，它允许开发者在运行时根据需要创建和修改表单结构。在Web应用中，这种能力尤为重要，因为它可以满足不同用户的需求，或者适应不断变化的数据输入需求。...
当需要动态添加或删除表单字段时，可以通过更新这个状态来触发组件重新渲染。 2. **表单控件**：React社区提供了许多优秀的库，如`formik`、`yup`、`react-hook-form`等，它们简化了表单处理和验证的过程。在动态...
例如，通过编程方式，你可以实现表格行的动态添加和删除，以适应不同数量的数据。 至于Pdf，这是一种广泛使用的文档格式，具有高度的安全性和跨平台兼容性。Adobe Acrobat是处理PDF表单的权威工具，但它需要付费。...
easyUI页面datagrid动态列和form字段动态添加；项目开发时用到的，废了不少事，大概总了一下，现在发出来共享给想我一样的要用到的菜鸟们，谢谢