请采用网页对话框的方式 showModalDialog
showModalDialog是jswindow对象的一个方法,和window.open一样都是打开一个新的页面。
区别是:showModalDialog打开子窗口后,父窗口就不能获取焦点了(也就是无法操作了)。
可以在子窗口中通过设置window.returnValue的值,让父窗口可以获取这个returnvalue.
2.一个例子
1)主窗口main.html,
2)在主窗口中通过showModalDialog的方式打开子窗口sub.html
3)在子窗口中设置returnValue返回给主窗口使用
main.html
复制代码代码如下:
<HTML><HEAD>
<METANAME="GENERATOR"Content="oscar999">
</HEAD>
<script>
functionshowmodal()
{
varret=window.showModalDialog("sub.html?temp="+Math.random())
alert("subreturnvalueis"+ret)
}
</script>
<BODY>
<INPUTid=button1type=buttonvalue="opensub"name=button1onclick="showmodal()">
</BODY>
</HTML>
sub.html
<HTML><HEAD>
<METANAME="GENERATOR"Content="oscar999">
</HEAD>
<script>
functionreturnMain()
{
window.returnValue="returnfromsub"
window.close()
}
</script>
<BODY>
<INPUTid=button1type=buttonvalue="returnandclose"name=button1onclick="returnMain()">
</BODY>
</HTML>
这种目前只有IE可用,其它浏览器都不可用了
方式二:
采用其它js框架,弹出对话框的模式
第一种、使用原生javascript的window.open()方法(大部分情况下会被浏览自阻止)第二种、模拟表单(form)提交,原理是指定表单的action为想要打开的URL地址,target设置为"_blank"
不过模拟表单提交的方法经很多网友反映说也会被阻止
第三种、模拟超链接(<a>)被点击,用jquery的写法如下,注意最后openLink[0]是模拟的原生DOM对象被点击的(使用Jquery对象的话没反应)
var openLink = $("")
openLink.attr('href', 'URL地址')
openLink[0].click()
这种方法个人比较推荐的,因为简单方便
第四种、利用浏览器的冒泡事件(这种方法稍微有点复杂,呵呵)
clickOpenWin: function(f){
var dataKey = "clickOpenWin.dataKey"
var me = $(this)
var A = me.data(dataKey)
var returnData = null
if(!A){
A = $("")
me.data(dataKey, A)
A.click(function(e){
if(returnData){
A.attr("href", returnData)
}else {
A.before(me)
e.stop()
}
})
}
me.mouseover(function(){$(this).before(A).appendTo(A)})
me.mouseout(function(){A.before($(this))})
me.click(function(){
A.attr("href", "#|")
returnData = f.apply(this, arguments)
})
}
1. 首先,说一下最终的效果,是实现用 “A” 包含你要触发弹窗的元素,原来的click事件要返回弹窗的URL 对应这一句 “returnData = f.apply(this, arguments)”
2. 然后就要说到弹窗拦截的策略了,具体我就不说了,反正 策略里是不会拦截 “A” 本身吧
3. 最后就是合成了,用A包含后,因为事件会冒泡,所以利用正常的点击,生成动态的 链接地址 给A,触发A的原始点击事件,就完成了