JS 点击元素发ajax请求 打开一个新窗口
2014-05-02 22:11
405 查看
JS 点击元素发ajax请求 打开一个新窗口
经常在项目中会碰到这样的需求,点击某个元素后,需要发ajax请求,请求成功以后,开发需要把链接传给前端(或者说请求成功后打开新窗口),前端需要通过新窗口打开这个链接,其实这样的原理大家可能觉得非常简单,想起来非常简单,用JS中的window.open就可以实现打开新的窗口,或者点击div元素,发ajax请求成功后,动态把链接传给a标签,然后再触发a标签事件,也可以实现,对吧?曾几何时,我也曾经把这样的问题发到JS群里面去,很多JS社区朋友说 龙恩 这么简单的问题你都实现不了?你怎么做前端的?大家都觉得非常简单,最后讨论了一个多小时,都没有结果!很多人提议用window.open,还有人提用location.href ="" 然后设置target="_blank"等,还有提出用form表单去提交,但是不管他们用任何方式,效果都一样,在主流的浏览器 firefox and chrome 结果是:被浏览器拦截了!(IE我不管),正常的情况下 点击一个元素 用window.open打开一个新的网页 都没有问题,并且不会被浏览器拦截!这个大家都知道,但是为什么需要多一步发ajax请求 且被浏览器拦截了呢?为了解决这么一个问题,肯定要做做demo,我是这样这样做的:
JS如下:
URL 我可以不管 反正就是一个请求 且是同域的,这是ajax异步的请求,为了解决这个问题,我们可以让他们同步请求 就可以实现,firefox and chrome也不会被拦截了!
JS代码如下:
设置同步的请求就可以实现了,(async:false) 。大家都可以测试下!
经常在项目中会碰到这样的需求,点击某个元素后,需要发ajax请求,请求成功以后,开发需要把链接传给前端(或者说请求成功后打开新窗口),前端需要通过新窗口打开这个链接,其实这样的原理大家可能觉得非常简单,想起来非常简单,用JS中的window.open就可以实现打开新的窗口,或者点击div元素,发ajax请求成功后,动态把链接传给a标签,然后再触发a标签事件,也可以实现,对吧?曾几何时,我也曾经把这样的问题发到JS群里面去,很多JS社区朋友说 龙恩 这么简单的问题你都实现不了?你怎么做前端的?大家都觉得非常简单,最后讨论了一个多小时,都没有结果!很多人提议用window.open,还有人提用location.href ="" 然后设置target="_blank"等,还有提出用form表单去提交,但是不管他们用任何方式,效果都一样,在主流的浏览器 firefox and chrome 结果是:被浏览器拦截了!(IE我不管),正常的情况下 点击一个元素 用window.open打开一个新的网页 都没有问题,并且不会被浏览器拦截!这个大家都知道,但是为什么需要多一步发ajax请求 且被浏览器拦截了呢?为了解决这么一个问题,肯定要做做demo,我是这样这样做的:
<div class = "testA" style="cursor:pointer;">点击我弹出一个新窗口</div>
JS如下:
$('.testA').unbind('click').bind('click',function(){ $.ajax({ url:'http://localhost/demo/windowopen/test.php', 'type':'POST', dataType:'json', success: function(data){ if(data && data.success) { window.open('http://www.baidu.com'); } } }); });
URL 我可以不管 反正就是一个请求 且是同域的,这是ajax异步的请求,为了解决这个问题,我们可以让他们同步请求 就可以实现,firefox and chrome也不会被拦截了!
JS代码如下:
$('.testA').unbind('click').bind('click',function(){ $.ajax({ url:'http://localhost/demo/windowopen/test.php', 'type':'POST', async:false, dataType:'json', success: function(data){ if(data && data.success) { window.open('http://www.baidu.com'); } } }); });
设置同步的请求就可以实现了,(async:false) 。大家都可以测试下!
相关文章推荐
- JS 点击元素发ajax请求 打开一个新窗口
- 使用selenium+python;在页面A点击一个按钮跳转到页面B,页面A没有关闭,浏览器打开了一个B,切换窗口定位页面B的元素
- 去掉webapp点击一个链接或JS定义的可点击元素会出现一个半透明的灰色背景
- js 打开一个窗口
- SilverLight学习笔记-- 如何在一个HyperlinkButton点击后打开新窗口
- html,js一个元素做两次不同点击事件
- ajax请求成功后打开新窗口地址
- js向后台发送数据并新打开一个窗口
- html,js一个元素做两次不同点击事件
- js,jq点击打开小弹窗,当前页面弹出小窗口
- ajax或者js新窗口打开方式展示数据
- js对js加载拼接的html代码中元素添加ajax方法请求后台数据
- AJAX方法中提交请求,target="_blank" 不能正确打开新的浏览器窗口
- 点击一个超链接,弹出固定大小的新窗口(js实现)
- js打开一个新窗口
- 写了一个打开最大新窗口的JS
- 利用 SHDocVw::IShellWindowsPtr m_spSHWinds 遍历所有IE浏览器,得到里面的所有元素 还有一个是查找IE窗口里的submit按钮,模拟点击
- 使用js写点击一个事件使页面返回顶部以及控制一个元素在右下角的固定位置的方法
- jquery获取父窗口的元素 ;打开一个窗口的方式
- 一个窗口里包含一个iframe,点击iframe内的submit按钮,返回的视图总是显示在iframe中,我想要的效果是点击按钮后返回的视图是在浏览器窗口中...?asp.net mvc 的action中,不用js怎么实现??????????