jQuery实现浏览器之间跳转并传递参数功能【支持中文字符】

2019-11-16,,,,,,

本文实例讲述了jQuery实现浏览器之间跳转传递参数功能。分享给大家供大家参考,具体如下:

one.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title></title>
  <script src="https://cdn.bootcss.com/jquery/2.2.2/jquery.slim.js"></script>
</head>
<body>
<input type="text" class="keyword"/>
<button id="searchBtn">点击</button>
<script type="text/javascript">
  $("#searchBtn").click(function() {
    var searchText = jQuery.trim($(".keyword").val());
    var searchUrl = encodeURI("two.html?searchText=" + searchText); //使用encodeURI编码
    location.href = searchUrl;
  })
</script>
</body>
</html>

two.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title></title>
  <script src="https://cdn.bootcss.com/jquery/2.2.2/jquery.slim.js"></script>
</head>
<body>
<input type="text" class="keyword1"/>
<script type="text/javascript">
  //获取 上一个搜索页面传来的参数 
  var searchUrl = window.location.href;
  var searchData = searchUrl.split("="); //截取 url中的“=”,获得“=”后面的参数
  var searchText = decodeURI(searchData[1]); //decodeURI解码
  $(".keyword1").val(searchText);
</script>
</body>
</html>

运行结果:

更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery常见事件用法与技巧总结》、《jQuery form操作技巧汇总》、《jQuery操作json数据技巧汇总》、《jQuery常用插件及用法总结》、《jQuery扩展技巧总结》、《jQuery表格(table)操作技巧汇总》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

您可能感兴趣的文章:

  • js,jquery滚动/跳转页面到指定位置的实现思路
  • jQuery 锚点跳转滚动条平滑滚动一句话代码
  • jQuery实现延迟跳转的方法
  • jQuery移动web开发之页面跳转和加载外部页面的实现
  • jQuery 点击图片跳转上一张或下一张功能的实现代码
  • jquery.boxy弹出框(后隔N秒后自动隐藏/自动跳转)
  • jquery ajax 向后台传递数组参数示例
  • jquery post方式传递多个参数值后台以数组的方式进行接收
  • Jquery之Bind方法参数传递与接收的三种方法
  • JQuery.ajax传递中文参数的解决方法 推荐
  • jquery ajax传递中文参数乱码问题及解决方法说明

《jQuery实现浏览器之间跳转并传递参数功能【支持中文字符】.doc》

下载本文的Word格式文档,以方便收藏与打印。