<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML5无刷修改url - 琼台博客</title>
<script type="text/javascript">
function changeURL(){
var url = document.getElementById('url').value;
window.history.pushState({},0,'http://'+window.location.host+'/'+url);
} </script>
</head>
<body>
<h1>html5无刷新改变url</h1>
<div id="info" style="margin:30px 0;">
页面真实地址:
<span style="color:red;"><script type="text/javascript">document.write(window.location.href);</script></span>
</div>
<div>
请输入要改变地URL字符串:<input id='url' type="text" />
<button onclick="changeURL();">点击无刷改变url</button>
</div>
<div style="color:red;margin-top:30px;">请使用支持html5的浏览器访问</div>
<div style="margin-top:30px;"><a href="http://www.qttc.net/201303292.html" target="_blank">《html5无刷新改变URL》</a> - 琼台博客</div>
</body> </html>

  http://www.qttc.net/201303292.html

无刷新URL 更新的更多相关文章

  1. Jquery无刷新实时更新表格数据

    html代码: <style> .editbox { display:none } .editbox { font-size:14px; width:70px; background-co ...

  2. 利用history.pushState()实现页面无刷新更新

    本来是在研究vue-router如何记录滚动位置,点返回的时候还是回到原来的位置,看到有人说的history.state存了一个值,才把history研究一下,发现 history.pushState ...

  3. 使用AjaxPro实现无刷新更新数据

    需求 在一个页面动态无刷新的更新后台得到的数据.要想无刷新的更新数据,需要使用Javascript能够获取后台返回的数据,然后通过第三方Javascript库(JQuery等)动态更新web页面DOM ...

  4. AjaxPro实现无刷新更新数据

    使用AjaxPro实现无刷新更新数据 需求 在一个页面动态无刷新的更新后台得到的数据.要想无刷新的更新数据,需要使用Javascript能够获取后台返回的数据,然后通过第三方Javascript库(J ...

  5. window.history.pushState与ajax实现无刷新更新页面url

    ajax能无刷新更新数据,但是不能更新url HTML5的新API: window.history.pushState, window.history.replaceState 用户操作history ...

  6. [转]jquery 点击表格变为input可以修改无刷新更新数据

    原文地址:http://www.freejs.net/article_biaodan_43.html 之前已经发了2篇类似的文章<点击变td为input更新>和<jquery表格可编 ...

  7. jquery表格可编辑修改表格里面的值,点击td变input无刷新更新表格

    td点击后变为input可以输入,更新数据,无刷新更新 演示 XML/HTML Code <table border="0" cellpadding="0" ...

  8. HTML5无刷新修改Url,history pushState/replaceState

    一.认识window.history window.history表示window对象的历史记录,是由用户主动产生,并且接受javascript脚本控制的全局对象.window对象通过history对 ...

  9. 仿联想商城laravel实战---5、无刷新的增删改查(动态页面更新的三种方式(html))

    仿联想商城laravel实战---5.无刷新的增删改查(动态页面更新的三种方式(html)) 一.总结 一句话总结: 直接js增加删除修改html 控制器直接返回处理好的页面 用双向绑定插件比如vue ...

随机推荐

  1. 《Linux命令行与shell脚本编程大全 第3版》Linux命令行---42

    以下为阅读<Linux命令行与shell脚本编程大全 第3版>的读书笔记,为了方便记录,特地与书的内容保持同步,特意做成一节一次随笔,特记录如下:

  2. FZU 1078 计算循环冗余码【模拟】

    计算机网络中采用循环冗余码来校验数据的正确性.其原理是:发送方计算出待发送的二进制数据的循环冗余码,并随同原数据一起发送到接收方:接收方通过重新计算接收到的数据的循环冗余码,并和收到的循环冗余码进行比 ...

  3. 关于asp.netCore3.0区域和路由配置

    在ASP.NET Core 3.0中路由配置和2.0不一样了 一.MVC 服务注册 ASP.NET Core 3.0 添加了用于注册内部的 MVC 方案的新选项Startup.ConfigureSer ...

  4. 【强连通分量】 Kosaraju和Tarjan算法 (标准模板+详细注释)

    codevs 题意:求最大强连通分量的大小以及所包含的顶点有哪些 Tarjan算法 #include<iostream> #include<queue> #include< ...

  5. luogu P2285 [HNOI2004]打鼹鼠

    题目描述 鼹鼠是一种很喜欢挖洞的动物,但每过一定的时间,它还是喜欢把头探出到地面上来透透气的.根据这个特点阿牛编写了一个打鼹鼠的游戏:在一个n*n的网格中,在某些时刻鼹鼠会在某一个网格探出头来透透气. ...

  6. 如何使用Ext.create() 调用一个窗体

    Ext.define("Scripts.Code.QM.OutgoingQuality.OQC.ReinspRequest.view.DefectContentsDetailInfoWind ...

  7. 序列文件(seq_file)接口

    转载:http://blog.csdn.net/gangyanliang/article/details/7244664 内容简介: 本文主要讲述序列文件(seq_file)接口的内核实现,如何使用它 ...

  8. JVM中的内存分区简介

    1.JVM的内存区域划分: 大多数 JVM 将内存区域划分为 Method Area(Non-Heap)(方法区) ,Heap(堆) , Program Counter Register(程序计数器) ...

  9. Copy Records From One Data Block To Another Data Block In Oracle Forms

    In this tutorial you will learn to copy the records from one data block to another data block on sam ...

  10. EasyMvc入门教程-高级控件说明(20)表格控件

    表单与表格是信息化系统里很常见的控件,EasyMvc提供了简单的数据绑定方式(基于Json),看下面的示例:  准备的接口地址代码如下:(该接口适用以下所有例子) public IActionResu ...