cari

Rumah >hujung hadapan web >tutorial js >jQuery实现浏览器之间跳转并传递参数功能【支持中文字符】

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

亚连
亚连asal
2018-05-28 16:15:341753semak imbas

这篇文章主要介绍了jQuery实现浏览器之间跳转并传递参数功能,具有支持中文字符传输的功能,涉及jQuery编码转换、事件响应、页面跳转等相关操作技巧,需要的朋友可以参考下

本文实例讲述了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>

运行结果：

上面是我整理给大家的，希望今后会对大家有帮助。

相关文章：

基于firefox实现ajax图片上传

Ajax加载外部页面弹出层效果实现方法

ajax跨域(基础域名相同)表单提交的方法

Atas ialah kandungan terperinci jQuery实现浏览器之间跳转并传递参数功能【支持中文字符】. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：vue页面加载闪烁问题的解决方法Artikel seterusnya：vue-cli axios请求方式及跨域处理问题

Artikel berkaitan

Lihat lagi