- 浏览: 200623 次
- 性别:
- 来自: 厦门
文章分类
最新评论
-
huaxialonger:
根结点怎么不能折起来啊
JavaScript树型菜单 dtree -
yan578351314:
这东西好呀!!!顶。。。。。
JavaScript树型菜单 dtree -
s524141771:
LZ,当在一个页面内生成2个或多个树时,展开节点会出问题,即: ...
JavaScript树型菜单 dtree -
tss0823:
我遇到了文件路径的问题。哈哈。谢谢!
java平台下通过jacob对excel,word进行打印等操作(转exceljava*^__^) -
qingfeng_101:
呵呵 我也有个分页的东东 是个JavaBean+JSP标签的 ...
Hibernate+Spring+Struts2整合开发中的一个分页显示方案
事先声明引用了别人的代码,做了一些细节上的改动。
使用模板,动态插入行
modelInsertRow.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <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 type="text/css"> <!-- .trans_msg { filter:alpha(opacity=100,enabled=1) revealTrans(duration=.2,transition=1) blendtrans(duration=.2); } --> </style> <script type="text/javascript"> //--初始化变量-- var rT=true;//允许图像过渡 var bT=true;//允许图像淡入淡出 var endaction=false;//结束动画 var ns4 = document.layers; var ns6 = document.getElementById && !document.all; var ie4 = document.all; var toolTipSTYLE=""; function initToolTips() { if(ns4||ns6||ie4) { if(ns4) toolTipSTYLE = document.toolTipLayer; else if(ns6) toolTipSTYLE = document.getElementById("toolTipLayer").style; else if(ie4) toolTipSTYLE = document.all.toolTipLayer.style; if(ns4) document.captureEvents(Event.MOUSEMOVE); else { toolTipSTYLE.visibility = "visible"; toolTipSTYLE.display = "none"; } } } function toolTip(name) { if(toolTip.arguments.length < 1) // hide { if(ns4) { toolTipSTYLE.visibility = "hidden"; document.form1.error.value="0"; } else { //--图象过渡,淡出处理-- if (!endaction) {toolTipSTYLE.display = "none";} if (rT) document.all("msg1").filters[1].Apply(); if (bT) document.all("msg1").filters[2].Apply(); document.all("msg1").filters[0].opacity=0; if (rT) document.all("msg1").filters[1].Play(); if (bT) document.all("msg1").filters[2].Play(); if (rT){ if (document.all("msg1").filters[1].status==1 || document.all("msg1").filters[1].status==0){ toolTipSTYLE.display = "none";} } if (bT){ if (document.all("msg1").filters[2].status==1 || document.all("msg1").filters[2].status==0){ toolTipSTYLE.display = "none";} } if (!rT && !bT) toolTipSTYLE.display = "none"; //---------------------- } } else // show { var tw=120;//提示框宽度 var x=document.all[name].offsetLeft; var y=document.all[name].offsetTop; //alert(x + " " + y); offsetX = 110; offsetY = 55; if(name=="tdname1"){ offsetX=10; offsetY=-10; } if(name=="tdname2"){ offsetX=10; offsetY=-10; } if(name=="tdname3"){ offsetX=10; offsetY=-10; } var msg=getMessage(name); var fg = "#777777";//getFontColor(); var bg = "#eeeeee";//getBgColor(); var content = '<table id="msg1" name="msg1" border="0" cellspacing="0" cellpadding="1" bgcolor="' + fg + '" class="trans_msg"><<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>>' + '<table border="0" cellspacing="0" cellpadding="3" bgcolor="' + bg + '"><<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B> width=' + tw + '><font face="Arial" color="' + fg + '" size="-2">' + msg + ' \;</font></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>></table></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>></table>'; if(ns4) { toolTipSTYLE.document.write(content); toolTipSTYLE.document.close(); toolTipSTYLE.visibility = "visible"; toolTipSTYLE.left = x + offsetX; toolTipSTYLE.top = y + offsetY; } if(ns6) { document.getElementById("toolTipLayer").innerHTML = content; toolTipSTYLE.display='block' toolTipSTYLE.left = x + offsetX; toolTipSTYLE.top = y + offsetY; } if(ie4) { document.all("toolTipLayer").innerHTML=content; toolTipSTYLE.display='block'; toolTipSTYLE.left = x + offsetX; toolTipSTYLE.top = y + offsetY; //--图象过渡,淡入处理-- var cssopaction=document.all("msg1").filters[0].opacity; document.all("msg1").filters[0].opacity=0 if (rT) document.all("msg1").filters[1].Apply(); if (bT) document.all("msg1").filters[2].Apply(); document.all("msg1").filters[0].opacity=cssopaction; if (rT) document.all("msg1").filters[1].Play(); if (bT) document.all("msg1").filters[2].Play(); //---------------------- } } } function getMessage(tdname){ var msg=""; if(tdname=="tdname1" || tdname=="tdname2" || tdname=="tdname3") msg="请填写用户名"; return msg; } function sub(obj) { var my_tab = document.all("budgetTbl"); //alert(my_tab.rows.length); if(my_tab.rows.length == 3) { alert("至少保留一行"); } else { deleteRow(budgetTbl,obj.parentElement.parentElement.rowIndex); } } function checkrow() { insertRow(budgetTbl,budgetModel,-1); } //对指定表格按模板表格的内容插入一行 //opTbl:要增加行的表格对象 //modelTbl:模板表格 //index:要插入的位置,-1表示添加到最后位置 function insertRow(opTbl,modelTbl,index) { var rowObj; var rowAlign; var cellHtml; var cellClass; var cellAlign; var cellNoWarp; var cellObj; var cellColspan; for(var i=0;modelTbl!=null && i<modelTbl.rows.length;i++) { if(index!=null && index>=0) { rowObj=opTbl.insertRow(index); }else { rowObj=opTbl.insertRow(); } rowObj.className=modelTbl.rows[i].className; rowObj.align=modelTbl.rows[i].align; for(var j=0;modelTbl.rows[i].cells!=null && j<modelTbl.rows[i].cells.length;j++) { cellHtml=modelTbl.rows[i].cells[j].innerHTML; cellClass=modelTbl.rows[i].cells[j].className; cellAlign=modelTbl.rows[i].cells[j].align; cellNoWarp=modelTbl.rows[i].cells[j].noWarp; //加一个colspan,跨几列 cellColspan=modelTbl.rows[i].cells[j].colSpan; //alert(cellAlign); //alert(cellColspan); cellObj=rowObj.insertCell(); cellObj.align=cellAlign; cellObj.className=cellClass; cellObj.noWarp=cellNoWarp; cellObj.innerHTML=cellHtml; cellObj.colSpan = cellColspan; } } } //删除指定表格的一行 //opTbl:要操作的表格对象 //index:要删除的行位置,-1表示删最后一行 function deleteRow(opTbl,index) { if(opTbl==null)return; if(index==-1) { if(opTbl.rows.length>1){opTbl.deleteRow(opTbl.rows.length-1);} } else { opTbl.deleteRow(index); } } </script> </head> <body> <!-- 初始化步骤 --> <div id="toolTipLayer" style="position:absolute; visibility: hidden"></div> <p> <script>initToolTips()</script> </p> <form action="" method="post" name="form1"> <table id="budgetTbl" border="1"> <tr> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>><input type="button" name="btn" value="插入一行" onclick="checkrow()"></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> </tr> <tr align="center"> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>>操作</<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B> id="tdname1" colspan="2">名字1</<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B> id="tdname2">名字2</<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B> id="tdname3">名字3</<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> </tr> <tr align="center"> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>><input type="button" name="btn" value="删除" onclick="sub(this)"></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B> colspan="2"><input type="text" name="name1" <B style="COLOR: black; BACKGROUND-COLOR: #ff9999">onfocus</B>="toolTip('tdname1')" onblur="toolTip()"></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>><input type="text" name="name2" <B style="COLOR: black; BACKGROUND-COLOR: #ff9999">onfocus</B>="toolTip('tdname2')" onblur="toolTip()"></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>><input type="text" name="name3" <B style="COLOR: black; BACKGROUND-COLOR: #ff9999">onfocus</B>="toolTip('tdname3')" onblur="toolTip()"></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> </tr> </table> </form> <!-- 模板表格 --> <table style="position:absolute; display: none" id="budgetModel"> <tr align="center"> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>><input type="button" name="btn" value="删除" onclick="sub(this)"></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B> colspan="2"><input type="text" name="name1" <B style="COLOR: black; BACKGROUND-COLOR: #ff9999">onfocus</B>="toolTip('tdname1')" onblur="toolTip()"></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>><input type="text" name="name2" <B style="COLOR: black; BACKGROUND-COLOR: #ff9999">onfocus</B>="toolTip('tdname2')" onblur="toolTip()"></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> <<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>><input type="text" name="name3" <B style="COLOR: black; BACKGROUND-COLOR: #ff9999">onfocus</B>="toolTip('tdname3')" onblur="toolTip()"></<B style="COLOR: black; BACKGROUND-COLOR: #99ff99">td</B>> </tr> </table> </body> </html>
发表评论
-
js用法(如何获取select中的值和属性)
2012-12-11 21:50 3037js用法(如何获取select中的值和属性) <scr ... -
js操作table元素,表格的行列新增、删除汇集
2012-10-28 20:09 0/************ TableTool.js **** ... -
下拉框中的复选框
2009-06-14 00:51 1444<html><head><tit ... -
简单实现网站变灰的代码(JS)
2009-05-13 17:17 2033非常简单,在网页中增加如下代码:<script type ... -
整理天气预报代码
2009-05-13 10:00 2323http://www.weather.com.cn/stati ... -
js动态添加删除表格
2009-03-24 09:09 1123<script type="text/java ... -
动态多文件上传
2009-03-23 17:07 1008转载于 Virgo_S 方式一:事先写好多个input.在点 ... -
WEB office操作(页面内容导出)
2009-03-18 11:32 993<HTML> <HEAD> ... -
一个可以关闭的漂浮广告代码
2009-03-11 14:37 6387<script type="text/java ... -
window.open()的所有参数列表
2009-02-03 10:07 890前言:经常上网的朋友可能会到过这样一些网站,一进入首页立 ... -
js小应用 整理
2009-01-16 09:30 1789判断表单,下拉框是否 ... -
【翻译】超酷仿苹果机桌面js+Css飞行菜单
2009-01-07 10:37 2478演示在这里基于Jquery和Fisheye,在IE 6, IE ... -
js判断数字:用于判断用户注册时 密码强度的JS代码
2009-01-07 10:24 1948<script language=javascript& ... -
图片鼠标缩放 并限定显示大小
2008-12-09 15:32 1407<SCRIPT language=JavaScript ... -
省市区三级联动
2008-12-08 14:05 2319<html><head><tit ... -
简单灵活的权限树
2008-12-04 16:18 2520将 dree 作了一些修改: 1、 增加 Node 的属 ... -
showModalDialog/showModelessDialog使用例子
2008-12-02 14:10 1262(一)showModalDialog使用例子,父窗口向子窗口 ... -
showModalDialog和showModelessDialog
2008-12-02 14:08 883基本介绍:showModalD ... -
JavaScript树型菜单 dtree
2008-12-02 11:15 17786JS代码很简洁,但是实现了所有树形菜单应有的功能,安装和使用都 ... -
评估密码强度
2008-12-01 23:10 876密码已经是我们生活工作中必不可少的工具,但一个不安全的密码有 ...
相关推荐
JavaScript动态表单是一种在网页上创建、修改或交互操作表单元素的技术,它极大地提升了用户界面的灵活性和用户体验。在Web开发中,JavaScript扮演着关键角色,为表单提供了丰富的功能,如验证输入、动态添加删除...
在JavaScript编程中,动态添加表单是一项常见的需求,特别是在构建具有高度交互性和可扩展性的Web应用时。通过动态创建和管理表单元素,开发者可以轻松应对用户可能的需求变化,实现XML数据的加载和显示,从而增强...
在表单验证中,JavaScript可以通过监听表单的`submit`事件来阻止默认提交行为,然后逐个检查输入字段的值。可以使用`document.getElementById`或`document.querySelector`等方法获取表单元素,再利用`value`属性获取...
在Java开发领域,动态表单设计是一项重要的技术,它允许开发者根据业务需求创建和修改表单,无需编写大量的HTML和JavaScript代码。这种技术的核心在于提供一个灵活的、可配置的平台,用户或开发者可以通过界面来定义...
1. **表单元素创建**:通过JavaScript,开发者可以动态创建和操纵HTML表单元素,如输入框(input)、选择框(select)、复选框(checkbox)和按钮(button)等。 2. **数据验证**:JavaScript提供了实时验证用户输入的能力...
- **jquery.idealforms.min.js**:JavaScript文件,实现了表单的动态行为、键盘操作、验证等功能。需要与CSS文件一起引入到项目中,以实现插件的全部功能。 - **readme.txt**:通常包含插件的安装指南、使用方法和...
JavaScript弹出层表单提交是一种常见的用户交互设计,它允许用户在不离开当前页面的情况下填写并提交表单数据。这种技术常用于网站的登录、注册、评论或编辑功能,提供了良好的用户体验,因为用户无需跳转到新页面...
在网页设计中,JavaScript是一种非常重要的脚本语言,它能够为用户提供动态交互体验。当我们需要在表单中实现数据的实时计算时,JavaScript就显得尤为关键。本篇将深入探讨如何利用JavaScript完成表单的自动计算,以...
需要注意的是,表单的action属性是可以动态改变的,开发者可以通过JavaScript动态地修改表单的action属性,以改变数据提交的目标地址。 例如,如果我们想根据用户的某些操作更改表单提交的目标地址,可以编写如下...
"javascript表单正则验证自定义提示"这一主题聚焦于利用正则表达式(Regular Expressions)进行表单验证,并通过自定义提示来优化用户交互。 正则表达式是一种强大的文本处理工具,它可以用来匹配、查找、替换和...
这些变化可以通过JavaScript来实现,例如响应用户的点击、表单提交等事件,或者根据用户的位置、时间等信息动态展示不同的内容。 ### JavaScript在动态网页开发中的应用 1. **页面元素的动态更新**:利用DOM...
比较实用的javascript做的表单验证,验证的表单域包括用户名、密码、密码确认、密码提示问题、邮箱、手机号码、身份证。表单域基本通过获得焦点显示提示信息,失去焦点进行验证,还有提交表单验证。提交表单先进行...
本文将深入探讨"javascript表单验证方式一",介绍如何利用JavaScript进行表单验证,确保用户输入的数据符合预设规则,提高用户体验,同时也减轻了服务器端的压力。 首先,表单验证的基本目标是检查用户在HTML表单中...
JavaScript是一种广泛应用于网页和网络应用开发的脚本语言,它在客户端运行,为用户提供动态、交互式的用户体验。在这个“javascript实现注册表单”的项目中,我们将会探讨如何使用JavaScript来创建一个功能丰富的...
JavaScript作为客户端脚本语言,可以通过多种策略来防止用户意外或恶意地多次提交表单。以下是一些关键的知识点: 1. **禁用提交按钮**:最简单的预防方法是在用户点击提交按钮后立即将其禁用。这可以通过监听`...
3. JavaScript文件:处理表单的动态生成、数据验证、提交逻辑等。 4. 后端服务:提供API接口,接收表单数据并存储。 5. 数据库脚本:用于创建和操作表单数据的数据库结构。 在实际项目中,动态表单可能还需要考虑更...
javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单
8. **表单处理**:JavaScript可以验证用户输入,控制表单提交,甚至实现动态表单生成。 9. **动画与定时器**:`setTimeout()`和`setInterval()`可用来执行延时或周期性任务,创建平滑的动画效果。 10. **面向对象...
本文实例讲述了JavaScript获取表单内所有元素值的方法。分享给大家供大家参考。具体如下: 下面的JS代码可以遍历指定表单中的所有元素,并输出元素的值 <!DOCTYPE html> <html> <body> <form id=...
"javascript验证表单大全"这个主题涵盖了使用JavaScript进行表单验证的各种方法和技术,旨在为开发者提供全面的参考。以下是对这个主题的详细阐述: 一、表单验证的重要性 表单验证是确保用户输入数据有效性和安全...