当前位置: 编程技术>WEB前端
本页文章导读:
▪JavaScript将iframe中控件的值传到主页面控件中 主要是通过在主页面定义一个传输数据的函数GetData(data),然后在iframe嵌入页面中通过parent.GetData(data),这样即可在GetData实现将data进行处理即可。现在来看一下代码的实现,首先来看一个主界面.........
▪自制导航 最近由于项目需要一个简单的多级下拉菜单菜单但是由于业务和样式上的要求,为了简洁,在网上找了很多导航菜单控件都不大适合,所以突发奇想自己写个吧~该动手就动手啊~ <h2> .........
▪自定义Struts2简单标签 我以获取当前时间的标签为例,开发一个自定义的标签bin:currentTime。操作步骤如下:
一、首先要定义一个标签处理类。
package org.binbin.tag;
import java.io.IOException;
import java.text.DateFormat;
import jav.........
[1]JavaScript将iframe中控件的值传到主页面控件中
主要是通过在主页面定义一个传输数据的函数GetData(data),然后在iframe嵌入页面中通过parent.GetData(data),这样即可在GetData实现将data进行处理即可。
现在来看一下代码的实现,首先来看一个主界面的代码
<html>
<head>
<script type="text/javascript">
function GetData(data)
{
alert(data);
document.getElementById("id1").value=data;
}
</script>
</head>
<body>
<div>
<input id="id1" type="text" value="11" />
</div>
<div>
<iframe id="frameid" src="/blog_article/b.html">
</iframe>
</div>
</body>
</html>
<head>
<script type="text/javascript">
function GetData(data)
{
alert(data);
document.getElementById("id1").value=data;
}
</script>
</head>
<body>
<div>
<input id="id1" type="text" value="11" />
</div>
<div>
<iframe id="frameid" src="/blog_article/b.html">
</iframe>
</div>
</body>
</html>
可以看到在主页面定义一个JavaScript函数实现,将传入的data参数,赋值给id为id1的input 文本控件。
下面来看一个嵌入的b.html页面代码
<script type="text/javascript">
function OnTest()
{
var data=document.getElementById("test").value;
parent.GetData(data);
}
</script>
<div>
<input id="test" type="text" value="将此值传到主页面控件中" />
<button onclick="OnTest()">test</button>
</div>
function OnTest()
{
var data=document.getElementById("test").value;
parent.GetData(data);
}
</script>
<div>
<input id="test" type="text" value="将此值传到主页面控件中" />
<button onclick="OnTest()">test</button>
</div>
嵌入页面中主要通过一个按钮事件,将此页面中一个input文本控件中的值取出,然后通过parent.GetData(data)调用主页面的函数进行操作即可。
这是未点击按钮前的效果,现在点击按钮查看效果。
这样就实现了传值的效果
本文链接
[2]自制导航
最近由于项目需要一个简单的多级下拉菜单菜单但是由于业务和样式上的要求,为了简洁,在网上找了很多导航菜单控件都不大适合,所以突发奇想自己写个吧~该动手就动手啊~
<h2>
SuperFish</h2>
<ul hid="root">
<li><a href="javascript:void(0)" testid="aa">一级li 1</a>
<ul>
<li><a href="javascript:void(0)" testid="bb">二级 li 1</a></li>
<li><a href="javascript:void(0)" testid="cc">二级 li 2</a>
<ul>
<li><a href="javascript:void(0)" testid="dd">三级 li 1</a></li>
<li><a href="javascript:void(0)" testid="ee">三级 li 2</a></li>
<li><a href="javascript:void(0)" testid="ff">三级 li 3</a></li>
<li><a href="javascript:void(0)" testid="gg">三级 li 4</a></li>
<li><a href="javascript:void(0)" testid="hh">三级 li 5</a></li>
<li><a href="javascript:void(0)" testid="ii">三级 li 6</a>
<ul>
<li><a href="javascript:void(0)" testid="jj">四级 li 1</a></li>
<li><a href="javascript:void(0)" testid="kk">四级 li 2</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="javascript:void(0)" testid="ll">二级 li 3</a>
<ul>
<li><a href="javascript:void(0)" testid="mm">三级 li 6</
SuperFish</h2>
<ul hid="root">
<li><a href="javascript:void(0)" testid="aa">一级li 1</a>
<ul>
<li><a href="javascript:void(0)" testid="bb">二级 li 1</a></li>
<li><a href="javascript:void(0)" testid="cc">二级 li 2</a>
<ul>
<li><a href="javascript:void(0)" testid="dd">三级 li 1</a></li>
<li><a href="javascript:void(0)" testid="ee">三级 li 2</a></li>
<li><a href="javascript:void(0)" testid="ff">三级 li 3</a></li>
<li><a href="javascript:void(0)" testid="gg">三级 li 4</a></li>
<li><a href="javascript:void(0)" testid="hh">三级 li 5</a></li>
<li><a href="javascript:void(0)" testid="ii">三级 li 6</a>
<ul>
<li><a href="javascript:void(0)" testid="jj">四级 li 1</a></li>
<li><a href="javascript:void(0)" testid="kk">四级 li 2</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="javascript:void(0)" testid="ll">二级 li 3</a>
<ul>
<li><a href="javascript:void(0)" testid="mm">三级 li 6</
[3]自定义Struts2简单标签
来源: 互联网 发布时间: 2013-11-19
我以获取当前时间的标签为例,开发一个自定义的标签bin:currentTime。操作步骤如下:
一、首先要定义一个标签处理类。
package org.binbin.tag; import java.io.IOException; import java.text.DateFormat; import java.text.SimpleDateFormat; import java.util.Date; import javax.servlet.jsp.JspException; import javax.servlet.jsp.JspWriter; import javax.servlet.jsp.tagext.TagSupport; /** * 自定义标签 * @author binbin(cn.binbin@qq.com) * @date 2013-3-28 */ public class TimeTag extends TagSupport { private static final long serialVersionUID = 6918846280074418825L; @Override public int doStartTag() throws JspException { JspWriter out = this.pageContext.getOut(); //定义时间输出格式 DateFormat df = new SimpleDateFormat("yyyy/MM/dd HH:mm:ss"); //获取当前时间的指定格式字符串 String str = df.format(new Date()); try { //输出当前时间字符串到页面 out.print(str); } catch (IOException e) { //如果出现异常,当前程序无法处理,所以重新抛出一个运行时异常 throw new RuntimeException(e); } return super.doStartTag(); } }
二、然后在WEB-INF目录下添加一个标签库定义文件bin.tld
<?xml version="1.0" encoding="UTF-8" ?> <taglib xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-jsptaglibrary_2_0.xsd" version="2.0"> <tlib-version>1.0</tlib-version> <short-name>bin</short-name> <uri>/bin-tags</uri> <tag> <name>currentTime</name> <tag-class>org.binbin.tag.TimeTag</tag-class> <body-content>empty</body-content> </tag> </taglib>
三、在jsp页面中使用该标签
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <!-- 需要先导入相应标签库 --> <%@ taglib uri="/bin-tags" prefix="bin"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>My JSP '1.jsp' starting page</title> </head> <body> 系统当前时间:<bin:currentTime/> </body> </html>
以上过程即自定义标签开发的一般流程。仅供参考~
斌斌 (给我写信) 原创博文(http://blog.csdn.net/binbinxyz),转载请注明出处!
作者:binbinxyz 发表于2013-3-28 9:55:36 原文链接
阅读:0 评论:0 查看评论
最新技术文章:
 
站内导航:
特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!