<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!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">
<html>
<%@ include file="/common/global.jsp" %>
<%@ include file="/common/meta.jsp" %>
<script type="text/javascript">
$(document).ready(function(){
});
/**
*追加属性Div
*/
var index = 0;//全局属性对象下标定义处
var addProperty = function(isDelete){
var basePropertyDiv = $("#basePropertyDiv").html();
//input name 再造
var reg = new RegExp("\\[\\]","g"); //创建正则RegExp对象
basePropertyDiv = basePropertyDiv.replace(reg,"[" + index + "]");
index ++;
var addPropertyObject = $("#addPropertyDiv");
/**追加一个删除按钮**/
basePropertyDiv = "<div>" + basePropertyDiv;
if(isDelete == true){
basePropertyDiv = basePropertyDiv + "<input type='button' name='deletePropertyButton' id='deletePropertyButton' value='删除' onclick='deleteProperty(this)'/>";
}
basePropertyDiv = basePropertyDiv + "</div>";
//alert(basePropertyDiv);
addPropertyObject.append(basePropertyDiv);
};
/**
*删除属性Div
*/
var deleteProperty = function(obj){
index --;
if(index < 0){
index = 0;
}
var parentDiv = $(obj).parent();
parentDiv.remove();
};
</script>
<body>
<%@ include file="/common/top.jsp" %>
<h1>添加订单</h1>
<form action="${ctx }/order!add.action" method="post">
<table border=1 width=90%>
<tr>
<td>姓名</td>
<td><input type="text" name="order.receiverName"></td>
<td>电话</td>
<td><input type="text" name="order.telphone"></td>
</tr>
<tr>
<td>地址</td>
<td colspan="3"><input type="text" name="order.address" style="width:400px;"></td>
</tr>
</table>
<h2>订单详情</h2>
<div id="addPropertyDiv"></div>
<input type="button" name="addPropertyButton" id="addPropertyButton" value="追加属性" onclick="addProperty(true);"/>
</form>
<div id="basePropertyDiv" style="display:none;">
名称：<input type="text" name="orderItems[].goodsName"/>
价格：<input type="text" name="orderItems[].price"/>
数量：<input type="text" name="orderItems[].quantity"/>
</div>
<script type="text/javascript">addProperty(false);</script>
</body>
</html>
分享到：
相关推荐
还可以设置为'replace'，替换现有的数据集。 - `clearChart`：可选参数，布尔值。如果设为`true`，则在添加新数据前清除图表。 使用`feedData`方法的一个常见场景是在实时数据更新，比如股票价格、天气预报等。例如...
5. 字符串替换方法：str.replace(regexp|substr, newSubstr|function)。 三、数组的基础知识和应用 1. 在数组后面追加一项：arr.push(item)、arr[arr.length] = item。 2. 删除数组最后一项：arr.pop()、arr.splice...
动态创建一个 div 元素（以及其中的所有内容），并将它追加到 body 元素中。在这个函数的内部，是通过临时创建一个元素，并将这个元素的 innerHTML 属性设置为给定的标记字符串，来实现标记到 DOM 元素转换的。所以...
- 使用`replace`方法：`element.className = element.className.replace(/class1/g, '')`，通过正则表达式替换掉元素的class列表中的class。 ### JavaScript操作style JavaScript同样提供了一系列方法来操作元素...
• 11.8.htm JavaScript实现事件控制器 • 11.9.htm 元素属性综合应用 • 11.10.htm 动态修改表单元素内容 第12章（\第12章） • 12.1.htm Document树的简单例子 • 12.2....
- **document.location.replace(URL)**：替换历史记录中的当前条目，并加载新的URL地址。 #### Selection对象 - **document.selection**：用于获取用户在文档中选中的文本范围。此对象主要应用于IE浏览器，其他...
• 12.7.htm 结点删除与替换 • 12.8.htm 处理文本结点的方法 • 12.9.htm 处理属性的方法 • 12.10.htm HTMLElement对象 • 12.11.htm DOM遍历API • 12.12....
`这行代码会将`str`中的'abc'替换为空字符串，然后与原字符串拼接，结果为`123abc123`，所以选项A是正确的。 5. `nodeType`属性用于获取节点类型，返回值为1表示该节点是元素节点。 6. `document.documentElement`...
选项A（`<p>`）表示段落，选项C（`<div>`）表示块级容器，选项D（`<span>`）表示行内容器，均不用于超链接。 ### 6. 类的构造函数与成员变量赋值 - **知识点**：构造函数用于初始化对象的状态。在这个例子中，通过...
99.string.replace(regExpression,replaceString)替换现有字符串. 100.string.split(分隔符)返回一个数组存储值. 101.string.substr(start[,length])取从第几位到指定长度的字符串. 102.string.toLowerCase()使字符...