Keep track of site history? [duplicate] - javascript

This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
How to keep the browser history in sync when using Ajax?
I think this is a rather easy fix but I can't find an answer anywhere else...so here goes...I made this kind of template for my homepage...I know the code's not insanely elegant but my main problem is that what if I want to send someone to a specific part of my page...rather than just my "home"...take a look http://useless-r-us.t15.org/
I mean how can I reference each of "blag", "projects", and "about me" using some unique url but still have my pretty css3 transitions...I'm thinking something like this...
http://radokirov.com
P.S....I know blag is a typo --> http://xkcd.com/148/

You should use url hashes (the part of the url following the # sign).
Then, in javascript, in the ready (jquery) event handler, based on the url's hash, you should do the appropriate ajax request and populate the page with the appropriate content.
For more details: Modify Address Bar URL in AJAX App to Match Current State

Related

Insert javascript alert into url [duplicate]

This question already has answers here:
Call Javascript function from URL/address bar
(14 answers)
Closed 2 years ago.
I am currently learning some web programming related stuff. I'm a little confused on how I insert some javascript into say a random URL. I'm trying to insert an alert message with an echo payload so I couldn't do javascript:alert("testtestesttest"); which will work.
Should this not work?
echo?payload=javascript:alert("test");
I am using an older version of my browser so that javascript execution is possible. But for some reason javascript:alert("test"); works by itself but when i add it onto the end of the url with the echo payload it's just echoing the text after the payload.
EDIT: I have found my solution. Sorry.
you can do it ) of course everything is possible! Not sure modern browsers will allow this request. Need to check.
Buth this approach is usafe from the user prospective.
Imagine that somewone will put tricky code and use your site domain as trusted and will send a spam using this link.
Hey bro here is discount you can get!
https://someknownSite.com?javascript::getyourpasswordcode
Then why do you want to make this happen via URL? Let say you have a page, called "myAlert.php".
So what you can do is, you can write a script on this page, which will simply show the alert when somebody with this URL will access this.
Or you can also, write a simple condition that when a request has been made to this URL, you can show the alert box.
But If you are trying to insert the javascript in the URL and expecting the result then it's not possible. Because modern browsers won't let you run a script as the "< >" symbols will be changed.

Label defined in onclick event, like "javascript:bSubmitted=true" [duplicate]

This question already has answers here:
Why do you see colons while calling a javascript function in html sometimes? [duplicate]
(3 answers)
When is the 'javascript:' prefix valid syntax?
(4 answers)
What's the point of "javascript:" in code (not URLs)? [duplicate]
(4 answers)
Closed last year.
In an old piece of legacy code I found the following onclick event:
onclick="javascript:bSubmitted=true;"
Does anyone know what the javascript: label in front of this code does? I have never seen this notation before, and as far as I know whatever is in the onclick event is always javascript. Removing it, or changing it to something else doesn't seem to have an effect and IntelliJ seems to think it's an 'unnecessary label'.
Just out of curiousity I still would like to know what it does and what it can be used for. Does anyone know?
I think you can find your answer here (it's the only "official" source I've found that talks about this): HTML Standard.
Taken from 7.8.1 Navigating across documents
If resource is a request whose url's scheme is "javascript" Queue a
task, on the DOM manipulation task source and associated with the
active document of browsingContext, to run these steps:
Let response be the result of executing a javascript: URL request
given resource, the source browsing context, and browsingContext. Run
process a navigate response with resource, response, navigationType,
the source browsing context, browsingContext,
incumbentNavigationOrigin, and activeDocumentNavigationOrigin.
Basically, the javascript: can be used as an url scheme which (just for adding something to the boilerplate) was and still is used for many XSS injections.
In that case specifically (upon a click event) it sounds unnecessary indeed, while it could be useful on an href, as you may see here (fiddle linked because the StackOverflow snippet manager doesn't allow alerts on javascript:): https://jsfiddle.net/73rmzjgw/
When any changes perform into form then javascript checks that, any changes is there or not. if it has any then it alerts the user before they navigate away from the page.
This action can be disabled on a submit button click by adding
onclick="javascript:bSubmitted=true;"
to its tag.

Is it possible to continuing running JavaScript code after a redirect? [duplicate]

This question already has answers here:
execute a function after redirecting - javascript
(3 answers)
Closed 7 years ago.
So, on my website, a user types in a subject they want the gist of, then after searching, it redirects them to a Wikipedia API displaying the general idea of the subject. However, there's a bunch of information about the API that gets in the way on the webpage, so I need to use JavaScript to get rid of that excess stuff.
Unfortunately, after changing webpages, it seems I can't run any more code from my website.
Any solution to this?
You could use an iframe, like so:
<iframe id="wikipedia-stuff">
</iframe>
And populate it like so:
<script>
document.getElementById("wikipedia-stuff").src = "http://wikipedia.stuff";
</script>
The wikipedia stuff would be in the iframe, and your code would still be running.

Change URL without reloading [duplicate]

This question already has answers here:
Changing the URL without reloading the page
(7 answers)
Closed 8 years ago.
i see sometimes on some sites like facebook or the Play Store from google, that by clicking a link the url changes (NOT with #blah), but the wohle site doesn't reload. I can use back/forward, so it could't be javascript, i think.
Can anybody say me how to implement that on a site? thanks
It uses pushState, and it is done using javascript and HTML5 with pushState compatible browsers. Here is some documentation: https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history
A quote from those docs:
Suppose http://mozilla.org/foo.html executes the following JavaScript:
var stateObj = { foo: "bar" };
history.pushState(stateObj, "page 2", "bar.html");
This will cause the URL bar to display
http://mozilla.org/bar.html, but won't cause the browser to load
bar.html or even check that bar.html exists.
The url can be changed in this way, and the new page is rendered using javascript. I do this by using Backbone.js, but there are other tools to do the same thing. It is mostly the same technique as those URLs with # in them, except they get rid of the hash. Backbone.js will use a # by default, but can be configured to make the URL to appear normal.
Here is a SO question about how to do this using Backbone
Another way this can be achieved is with AngularJS. As was said in the above comments, this will use AJAX to get new data to display, and then use javascript to change the content of the page, all without loading a new URL.
For browsers whose not support htmll5 like ie8, you can use the library https://github.com/browserstate/history.js/ which emulate the html5 pushstate method.

low cost page transitions [duplicate]

This question already has answers here:
How to show Ajax requests in URL?
(7 answers)
Closed 9 years ago.
I'm relatively new to web development so this probably is a odd question. I want part of my site to load a new page. But significant part doen't need to change. What I do now is that I load content into a div.
$('#rightdiv').load("about.html");
The downside to this is that the address doesn't change, I believe there is a good solution but I don't know how. I have tried googleing it but I can't find anything good on it. So I would love to see both a solution and how the sollution is called (hope you know what I mean).
Thank you for your time and effort.
Browsers supporting HTML5's pushState will let you change the path:
$('#rightdiv').load("about.html", function pushState(){
if(history && history.pushState){
history.pushState('','','about.html');
}
});
The standard way is to use location.hash. So for example if you were on mysite.com/, and loaded the about.html page, you could set the hash to #about. This would not cause the page to reload, but would alter the URL (to provide for bookmark/back button support).
As an example, using the success callback to load():
$('#rightdiv').load('about.html', function() {
location.hash = 'about';
});
HTML5 adds a new API called pushState. This allows for more complete modification of the URL without causing a page reload. Read more about that here.
This can easily be achieved by taking advantage of HTML5 and its features. Myspace does something similar to what you are asking. The HTML5 History API to change the browser URL without refreshing the page. Combining this with JQuery $.ajax can produce the effects shown in myspace, github and facebook. "arundavid" has a great explanation on this link at tinywall.info
That's the right way to load data into a div using AJAX. I personally prefer to use the jQuery.ajax() function though.

Categories

Resources