We Keep Coding

print url of page using load function to load page inside a page

Hi I am using following function to load page inside another page. The thing I want is that When inside page load it should change url as well. so if page refresh user stay on same page. Right now when user refresh the page or try to go back it go to parent page.
Here is function.
$("#canceledOrders").click(function(){
$("#pageload").load("canceledOrders.php");
});
Html
<li><a id="canceledOrders" href="#!" class="waves-effect">
<i data-icon="F" class="linea-icon linea-ecommerce"></i>
<span class="hide-menu">Canceled Orders</span></a></li>
Now it creates .com/#! If I use some word in href it shows it in url but by refresh page it back to main page again.
Thank you for help

You should use e.preventDefault to avoid the tag to function as it should by default. Instead, you are going to override it's functionality.
You can do that by modifying the code as such:
$("#canceledOrders").click(function(e) {
e.preventDefault();
$("#pageload").load("canceledOrders.php");
});

How to send all clicked links to a page before going to the URL in the link

Question: How would I set up a page so that all links when clicked go to a page called query_data.cfm where a database query is triggered and once complete send the user to the url of the original link?
As of right now I am adding a class to all links on my page using javascript.
<script>
$(document).ready( function() {
$('a').addClass("tracker");
});
</script>
But what I also want to do is make it so all links with that class for example <a class="tracker" href="www.mywebsite.com/page2.cfm">Page 2</a> go to a page named www.mywebsite.com/query_data.cfm where a query is ran passing the value of href to a database and once complete redirect the user to www.mywebsite.com/page2.cfm
I hope this is enough information but if I missed anything please let me know.

One method is to simply change the links like:
<a class="tracker" href="www.mywebsite.com/query_data.cfm?destination=page2.cfm">Page 2</a>
Then all links will go to query_data.cfm which will record the #URL.destination# information and then CFLOCATION them on to #URL.destination#.

Edit: Oh, you are the same person, my bad. Reading malfunction.
I suggest that you try this: http://jsfiddle.net/xcr56gd1/.
Since you're using jquery to add to the links, you can hopefully see how you can use jquery to change the href to `/r.cfm?d= + $(this).attr('href'), properly encoding as a url.
$(document).ready(function () {
$("a").not(".norm").on("click", function(e) {
alert($(this).attr('href'));
// The alert just demonstrates that it's working and how to get href.
// You can call your ajax here.
e.preventDefault();
});
});
With this code, you can use the jquery on all links without the class "norm", so if you especially wanted a link not to track, this is how you would do it.

javascript: history.go(-1) doesnt work for the whole window

i have an unusual problem. I have a page which contains an iframe, which is controlled by the dropdown. So selection of the dropdown loads different iframes. Anyway - on the bottom I have a button to return to the previous page (I mean the whole page, not previously loaded iframe on that page).
<a href="javascript: history.go(-1)">
Unfortunately it also includes the history of these iframes, so when I click on that button, it loads up the previous iframe instead of taking me back.
Here is how to explain it well:
go to this page: Click here
go to the hyperlink on that page
make couple of selections from the drop down (play with it)
click the return button on the very bottom of the page.
I want it to take me back to the first page (here.html), not go back to the previously loaded iframe on 1.html.
I have to use javascript history.go or similar script. I can't use direct link to here.html, as this page is a part of many other pages, so when the user clicks return, he is forwarded to his specific landing page.
I greatly appreciate any help.
It's a life-saving question

Use document.referer
var referrer = document.referrer;
window.location = referrer;
Check if it works !
<a href="javascript: window.location = document.referrer;">

You need to remove the newly iframe before sending browser back to the actual page.
Add click event on the return link
HTML:
<a id="return_link" href="#">
Javascript:
$(document).ready(function() {
$('#return_link').on('click', function(e) {
e.preventDefault();
$('#iframeId').remove();
window.location = document.referrer;
});
});

try this , Just remove extra spaces from statements.
href="javascript:history.go(-1)

jQuery toggle not working when back button is hit

I have the following jQuery code:
$(function() {
var linkSet = $('#link1').add('#link2');
linkSet.click(function() {
linkSet.toggle();
if ($(this).attr('id')=='link1'){
$('#frame').attr('src', 'www.google.com');
} else if ($(this).attr('id')=='link2'){
$('#frame').attr('src', 'www.yahoo.com');
}
});
});
On pageload, the link with id link1 is shown while link2 is hidden. When the user click the link1, it will the link1 then show the link2 then vice versa. While toggle takes place, it also changes the source of an iframe which is named frame.
My problem here is when I hit back button, the content of the frame will go back to its previous content BUT the link are not changing. What did I missed here? Thanks in advance!
Note: The links are on a webpage, then inside that webpage is an iframe.
EDIT:
<div id="header">
<ul>
<li><a id="link1" href=#">Link1</a>
<li><a id="link2" href=#">Link2</a>
</ul>
</div>
<div id="iframe">
<iframe id="frame" src="www.google.com"></iframe>
</div>

You mean when pressing the browser's back button right.
If so:
The issue is you need to have an event to trigger when the history changes, as that is the only easy way to respond to changes in history (such as when clicking the back button). Since the iframe url is indeed changing, it is therefore also affected by the back button naturally.
To get other non history based logic to work when pressing the back button and such...
There are two ways to do this. The new one is by using the history API, while the other more supported, and simpler way is by adding a hash to the url.
WHAT DOES THIS MEAN?
When you click the button you change the url with a hash. Like the url can become
'http://domain.com/blah/#myHash'
Then instead of doing your logic in the click, you do it when the hash changes. So this way as the user clicks back and/or forward the logic always runs fully.
I wrote an entire article about this technique a few months ago at http://andresgallo.com/2012/06/08/ajaxifying-the-web-the-easy-way/

My website alway scroll up when i click link?

I have a link
Text
when i click this link my page alway scroll up to the top. How do i manage it that when i clik this link my page not scroll up to the top.
Javascript? or something
thank you

you can add some javascript to deny the default behavior.
function myClickHandler(e) {
// your code here
// ...
// new code
if(e.preventDefault){ //firefox,chrome
e.preventDefault();
}
else { // ie
return false;
}
}
if you provide some more detail/example code, we can give you a more specific answer.

Not sure what you are trying to do, but maybe you are thinking of:
<a href="JavaScript:void(0);" >Text</a>
that'll do nothing.

You might want to post an example of a link that does this. My guess is that it's because you don't have an href set for the link or you ended the link href with a "#someId"
It's not that it's scrolling to the top of the page, it's refreshing the page.
An example of a top link:
Some Link
Somewhere <!-- will refresh and you end up at the top -->
EDIT
Ah... Now that you've provided the link... it's the Hash # that's the problem.
To avoid that from happening ( I'm guessing you want to do some Javascript on the link and you're trying to get it to do something.. ) then you need return false; in your javascript. This will return false from the link and won't follow it.

It is because you have only the hash # as "URL". It makes the browser jump to the top of the page (normally it would jump to the element with the corresponding ID if you specify any).
But what is the purpose of such a link if you don't use it?

The [relative] URL # is treated by browsers as the top of the page. Either change the link's href attribute to refer to another resource, or add a click event handler that prevents the default action. Better yet, if you intend it to be a button that triggers a click event, replace the <a> tag with a <button> which is more semantically correct anyway.

<body>
<h1 id="top">First Headline</h1>
<!-- your document here-->
go to Top
</body>
With Javascript you could add some smoothness like slowly scroll up. HTML Links