页面跳转同时执行js代码$(function(){});url参数传递

标题的前半部分其实不必赘述,按钮也可以换成超链接。。

假设是需要在A页面上的一个按钮,点击后跳转到B页面,传一些参数后且并B页面的某个js函数可以执行~~

关键在于如何跳转到目标页面之后并「接着」执行「目标页面的js函数」。原因是目标页面的某个js函数原来是需要点击该页面的按钮或超链接才能触发的,但现在需要在跳转到B页面后立即执行!

先不想是从A页面跳转到B页面,假设你想在B页面一打开就执行的话,是需要把代码逻辑写在$(function(){});里面的。这就是一个突破的思路。

我们在A页面定义一个按钮用于触发如题所示的操作:

Html代码  
  1. <button type="button" class="btn btn-info" οnclick="openReport()">打开报表</button>

它对应的js函数为:

Js代码  
  1. function openReport() {
  2. window.open("B页面的url?flag=true&A="+a,'newwindow','height=1100,width=1400');
  3. }

同时传递了2个参数给目标页面B页面:flag和A。

在B页面的js文件的$(fucntion(){});里面加上这一段代码(关键),如:

Js代码  
  1. var url = window.location.href;//获取当前浏览器的url
  2. index = url.indexOf("flag");//判断当前url是否有flag,如果有,说明是从A页面跳转而来的,就执行下面的程序
  3. if(index !=-1) {//由A页面跳转而来
  4. //参数准备
  5. var start = url.indexOf("A");
  6. var a = url.substring(start + "A".length+1);
  7. var date = new Date();
  8. var year = date.getFullYear();//当前年
  9. var month = date.getMonth() + 1;//当前月(月是从0开始,所以必须加上1)
  10. month = month<10 ? ("0"+month):month;
  11. var queryDate = year + month;
  12. // + "&suffix=" + encodeURI(encodeURI(suffix));
  13. var url= "ajax的url?A=" + a +"&queryDate=" + queryDate;
  14. //带参数执行逻辑
  15. $.ajax({
  16. url: url, dataType:"html",headers:{"X-Fragment":"_"},
  17. cache:false,
  18. success: function(html) {
  19. //响应成功后的逻辑处理
  20. }
  21. });
  22. }

这段代码是很典型的,对于A页面传递过来的参数的接收在代码的注释中都说明得十分详细。

顺便,还温习了js获取系统年和月的用法。

这里对于flag变量的妙用是一种巧思~~~

来自:http://raising.iteye.com/blog/2283257 iteye 中的尽力而为

转载于:https://www.cnblogs.com/MonaSong/p/5284021.html

javascript笔记——点击按钮(或超链接)如何跳转到另外一个页面并执行目标页面的js函数...相关推荐

  1. html点击按钮动复制推广地址,JavaScript实现点击按钮就复制当前网址

    JavaScript实现点击按钮就复制当前网址 点击按钮复制当前网址: 在大量的网站都有这样的功能,当点击一个按钮的时候可以复制当前页面的地址,以此可以方便网站用户对链接的存储,同时也便于网站的推广, ...

  2. 点击跳转到另一个页面

    当点击时跳转到另一个页面 Train这个文件创建的是page,不是创建的component 当我点击这个文本时跳转到下边这个页面 文件名:Navs.wxml 文件名:Train.wxml 在Navs. ...

  3. JavaScript倒计时跳转到另一个页面

    需求 页面上显示一个倒计时5秒的数字,到了5秒以后跳转到另一个页面 案例分析 页面上创建一个span用于显示变化的数字,点返回链接直接跳转. 定义一个变量为5,每过1秒调用1次刷新refresh()函 ...

  4. 前端html网页,点击按钮或超链接 弹出 一个登陆的div窗口或者对话框

    1.点击链接弹出一个可操作的div窗口代码效果图展示: 代码示例: <!DOCTYPE> <html> <head> <title>点击文字弹出一个DI ...

  5. JavaScript实现点击按钮显示当前时间

    显示当前时间,点击按钮,显示当前系统时间 代码如下 <script>function tim() {var date = new Date();//当前系统时间var year = dat ...

  6. JavaScript网页中点击按钮切换显示的内容

    前言: 我是实习两个月的前端开发实习生, 最近在制作公司的官方网站过程中遇到了一个网页前端开发中比较普遍的需求: 点击不同的按钮 页面上的内容随之更换, 并且按钮的背景颜色也要呈现为被选中的样式. 以 ...

  7. JavaScript笔记-点击button提交form表单

    功能如下: 点击购买后,点击确定. 确定调用了一个js函数,提交form表达给后端 代码如下: <div class="modal-footer"><button ...

  8. 【JavaScript 笔记 】— 基础语法(数据类型、字符串、数组、对象、Map、Set、iterable、函数基础)

    JavaScript个人笔记 数据类型和变量 浮点数的相等比较 null 和 undefined == 与 === strict模式 字符串 模板字符串 字符串常用方法 数组 数组常用方法 对象 条件 ...

  9. js 点击按钮或者图片,实现图片上传以及将图片显示在页面上

     点击图片本身,实现图片上传: 1.html页面 <div class="card">// 用于接受上传的图片<img src="img.jpg&quo ...

最新文章

  1. CSS Sprites (转)
  2. andorid手机电脑操作
  3. python3模拟键盘输入_Python模拟键盘输入
  4. 公开征集 | 每个人都可以成为 COSCon'21 主论坛的开源明星
  5. [洪流学堂]Hololens开发入门篇3:使用基本功能开发一个小应用
  6. 图解 CSS (2): border - 边框
  7. qt creator纯C或C++项目在windows下的命令行中文乱码解决
  8. Foobar2000的配置及优化
  9. Bugku-网站被黑
  10. html的外部调用函数,如何在HTML中调用外部JavaScript函数
  11. photoshop cs5 中 复制图层的快捷键是那个
  12. 一段话加省略号怎么写html,HTML 应用 文字省略号的表示
  13. git cherry-pick 的时候出现git cherry-pick xxx  fatal: bad object xxx
  14. 大脑皮质网络中社区内和社区间同步与相关性的竞争|Competition between intra-community and inter-community synchronization...
  15. 低频125KHZ|134.2KHZ安卓手持机|RFID智能终端CK-LH100-SYS性能与应用方案
  16. 模具设计知多少?注塑件设计要点都在这
  17. Topic 和 Partition
  18. 2018考研数学二答案真题解析.pdf
  19. ubuntu设置固定ip地址的方法
  20. (四)移动UI设计基础

热门文章

  1. python 画三维函数图-如何用Matplotlib 画三维图的示例代码
  2. python爬虫用途-Python爬虫入门知识:解析数据篇
  3. ipython安装教程-CentOS 5安装IPython
  4. python绘制柱形图-Python openpyxl Excel绘制柱形图
  5. python整理excel数据-Python 之Excel 数据处理
  6. python爬虫流程-Python爬虫流程
  7. python教程课后答案-python程序设计教程课后答案
  8. python编程入门经典实例-终于明了python入门经典实例
  9. python怎么读取文件-python如何读取文件的数据
  10. 未来教育python视频百度云-2019年计算机二级Python语言程序设计考试大纲