html5-history

问题 Given a simple component: export default class SearchForm extends Component { constructor(props) { super(props) this.state = { query: '' } } onSubmit = (event) => { event.preventDefault() history.push(`/results/${this.state.query}`, { query: this.state.query }) } render() { return ( <form onSubmit={this.onSubmit}> <input type="text" value={this.state.query} onChange={event => this.setState({ query: event.target.value })} /> <button>Search</button> </form> ) } } And the test: describe(

问题 I made some Angular routes as shown in the code bellow. app.config(function($routeProvider, $locationProvider, $provide) { $routeProvider .when('/', { templateUrl: 'home.html', controller: 'AppCtrl' }); .when('/portfolio', { templateUrl: 'portfolio.html', controller: 'AppCtrl' }) $provide.decorator('$sniffer', function($delegate) { $delegate.history = historyCompatCheck(); return $delegate; }); $locationProvider.html5Mode(true); }); This works fine, after i set the base href to be "/" it

问题 Ember documentation states that it can be set to use the History API for routing rather than hash-based fragments by using: App.Router.reopen({ location: 'history' }); But I can find no mention of what will happen if a browser doesn't support the History API. Will it fall back to using a hash like History.js? If not, should I check for History API support and switch history implementation to hash if it isn't supported? 回答1: There doesn't seem to be any History API support detection in the

问题 In my single-page backbone app, I'm having trouble getting my longer urls to route properly in IE. Any urls that are nested more than one level, don't receive the proper hash fallbak when loading them directly. top-level urls work fine... when I load: domain.com/resource in IE I get: domain.com/#resource (as expected) navigating (in-app) works fine... when I click on a link to: domain.com/resource/12345 IE sends me to: domain.com/#resource/12345 (as expected) but accessing deeper urls

问题 I have an application by mean-stack that hosts a website and an Excel add-in. html5 is enabled, and it has <script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script> <script src="https://cdn.rawgit.com/devote/HTML5-History-API/master/history.js"></script> In the Excel add-in, I have a button that opens a page in the website by Dialog API: $scope.openDialog = function () { Office.context.ui.displayDialogAsync("https://localhost:3000/preview/tmp/6wr-4PqdBrYQwjp3AAAD", {}

问题 My active (opened) links are highlighted with JS . <script type="text/javascript"> $(document).ready(function(){ $("a.nav1").click(function() { $(".active").removeClass("active"); $(this).addClass("active"); }); }); </script> links example <div id="navigation"> <ul> <li><a class="nav1" data-tab="#home" id="link-home"href="#home">Home</a></li> <li><a class="nav1" data-tab="#football" id="link-football" href="#football">Football</a></li> <li><a class="nav1" data-tab="#hockey" id="link-hockey

问题 How can you set URL parameters using History.pushState() to avoid browser refreshes? If there is a not a simple JS solution, is there already a popular library or built in function for jQuery? Here is a relevant SO question, where the accepted answer does not actually work according to comments & my test (it removes the query string instead of updating a value): history.pushState() change query values Just to be clear, I am referring to the URL parameters in a query string: http://google.com

问题 In a mean-stack web application, I use html5mode and have the following code in index.html : <base href="/" /> <script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script> <script src="https://cdn.rawgit.com/devote/HTML5-History-API/master/history.js"></script> I have defined the following angular-ui-router: .state('addinHome', { url: '/addin/home', template: "home page" }) .state('addinTest', { url: '/addin/test', template: '<a href="addin/home">one</a>', controller:

问题 This is my code to change url on ajax load which works $.ajax({ url: url, success: function (data) { $(selector).html(data); var title = data.match("<title>(.*?)</title>")[1]; // get title of loaded content window.history.pushState( {page : 0} , document.title, window.location.href ); // store current url. window.history.pushState( {page : 1} , title, url ); // Change url. document.title = title; // Since title is not changing with window.history.pushState(), //manually change title. Possible

问题 I want to inject a new state to browser history when the platform is loaded for the 1st time so when the user clicks browser back button it should land to the home page of the app. I tried to add new state using 1. PlatformLocation pushState() 2. window.history.pushState() location.pushState(null, 'home', 'home'); // window.history.pushState(null, 'home', 'home'); I even tried giving full URL location.pushState(null, 'home', 'http://localhost:4200/home'); // window.history.pushState(null,