jquery redirect issues - javascript

I am having problems in redirecting page with jquery. I have a variable url which contains localhost/abc#123. When i write document.location.href = url;, the page redirects to localhost/abc leaving #123. How to resolve this issue

var url = "http://bing.com/refresh/test.html#123";
document.location.href=url
it's work fine for me in my firefox. do you have tried to debug what happen on your side. I have test this code in IE8 + firefox + chrome. I hope it's will work fine for you.
if this code doesn't work on your side then try
window.location.replace(url)
as your comment it's look like you have used Anchor so tried this one.
$("#myanchor").click(function(e){
e.preventDefault();
// redirect code here
});

Related

How Can I go to another HTML file

For some reason, document.location.href , window.location.href , and window.location.replace is not working, I'm using localhost for now and I don't know how to redirect it to another webpage. I tried adding http:// on front, it's still not working, I tried making it redirect to another online website, It also didn't work. I read a lot of thread already and tried them but none of them worked for me.
var loginBut = document.getElementById("RDbtn1");
loginBut.addEventListener("click", checklogin);
function check(){
document.location.href = "http://localhost/some/directory/here";
alert(document.location.origin + '/some/directory'); // I just use this to know that the button is being pressed.
}
html:
<!-- some code here-->
<li><button class="login1" id="RDbtn1">LOGIN</button></li>
<!-- some code here -->
I believe you should redirect to particular html page and should give the port on which your local host application is working
document.location.href = "http://localhost:8080/some/directory/here/file.html";
It is window.location (nothing or replace or href) - document.location is normally used to get the actual page
What's the difference between window.location and document.location in JavaScript?
If you are on the same server, no need to qualify the page but I would add the actual page you try to load
window.location = "/some/directory/here/index.html"

location.href in IE & Edge

Having issues getting my one page web application to work in Internet Explorer and Edge. It works perfectly fine in other browsers.
The issue that I'm having is that I can't seem to get the navigation to work.
I've tried the following:
location.href = '#quickQuiz'
location.href = '/#quickQuiz'
window.location.href = '#quickQuiz'
window.location.href = '/#quickQuiz'
document.location.href = '/#quickQuiz'
document.location.href = '#quickQuiz'
function goHere(where) { window.location = where; return false; }
location.hash = '#quickQuiz'
location.hash = '/#quickQuiz'
All of them works perfectly fine on other browsers. What am I doing wrong?
http://www.snabbteori.se if you wanna see it for yourself.
EDIT1: Additional code
The item in my navigation menu looks like the following:
<li data-icon="info"><a id="teoriNav">Teori</a></li>
And then I check for a click event on it. I know that it's possible to just put href="#teori in there, but I am just using this one as an example, there are other links where I need to perform AJAX calls too, this one doesn't need it though just to verify there isn't something wrong with my AJAX calls causing it.
$(document).delegate('#teoriNav', 'click', function () {
location.hash('#teori');');
});
I've also tried this but doesn't work:
$('#teoriNav').click( function() {
location.hash('#teori');
});
EDIT2: Updates
I believe I've fixed all jQuery errors and some other issues. The only thing I'm getting in the Internet Explorer console is:
HTML1300: Navigation occured.
DOM7011: The code on this page disabled back and forward caching.
And then when I click on the button I get output which I wrote which confirms it registers my click on the button. But still it won't navigate.
EDIT3: Ugly temporary fix
It works after doing a page reload after navigating.
var isIE = /*#cc_on!#*/false || !!document.documentMode;
var isEdge = !isIE && !!window.StyleMedia;
if(isEdge || isIE)
location.reload();
But I hate the fact that the site has to reload, and if someone has a real fix for this I would really appreciate it...
Edge has an issue with links if your code is not propper. You should check your console for any errors, This is most likely.
We will need more information from your side to help you further.
Post your HTML and your Javascript (just relating to this area of problem)
and we can then better help you.
I sagest fixing your jQuery errors first and trying again.
Ok my Browser test have given me a variation of 30-60 error relating to jQuery across Mac to Win. These will need to be addressed.
You also have a XSS issue that needs to be resolved. You have HTTPS from facebook but then HTTP on your website, These will need to match.

Page redirection not working in firefox using window.location but working in chrome

I wrote the following code to redirect the user to different pages on click. While the following code works fine in chrome, but it does not work in IE or firefox.
However, when i open the same buttons in new tab, they work just fine. But with single left click they do not work on any browser other than chrome.
I tried variations like, window.location='url' and window.location.assign(url) and window.location.href="url" but to no avail.
Please if someone can help me.
if (this.href == "http://www.successlabs.pk/download.php") {
window.location.href= "http://www.successlabs.pk/download.php";}
else if (this.href == "http://www.successlabs.pk/ContactUs.html") {
window.location.href= "http://www.successlabs.pk/ContactUs.html";}
Thanks in advance.
this question is over a year old, but this is what worked for me:
function gotoPage(_link) {
var _link = 'http://www.successlabs.pk/download.php';
window.location(_link);
return false;
}
It's possible that adding the 'return false;' line is what will make it work for you. This SO page explains why.
From the horse's mouth: https://developer.mozilla.org/en-US/docs/Web/API/Window/location
Example #1: Navigate to a new page
Whenever a new value is assigned to the location object, a document
will be loaded using the URL as if location.assign() had been called
with the modified URL. Note that security settings, like CORS, may
prevent this to effectively happen.
location.assign("http://www.mozilla.org"); // or location =
"http://www.mozilla.org";
I have never used location.href before only the two examples given above - and they work in all browsers

window.location.href causing animated gif loader to freeze in Firefox

I have a link which when clicked redirects the user to the same page except with additional parameters:
<a id="lnkExportToPDF" href="javascript:void(0)">Export</a>
$('#lnkExportToPDF').click(function (e) {
e.preventDefault();
window.location.href = path + 'users/export/' + parm1 + '/' + parm2;
});
On the server side I handle it by checking for "export" in the request path, and if it's found I write a PDF file to the response:
System.Web.HttpResponse response = System.Web.HttpContext.Current.Response;
response.Clear();
response.AddHeader("Content-Type", "application/pdf");
response.AddHeader("Content-Disposition", String.Format("attachment; filename=" + filename + ".pdf; size={0}", buffer.Length.ToString()));
response.BinaryWrite(buffer);
response.End();
Everything works and the user can download the file, but any additional actions by the user that uses the loader.gif which is on the page shows an unanimated loader.
What could be causing this to happen? Is there any way to refresh/reload the page/javascript after the response is complete?
edit: I've found a useful JS tool here: http://fgnass.github.io/spin.js/ but I'd prefer not to use it unless absolutely necessary
edit2: I also tried using a generic handler (.ashx) to handle the request (ie. changing the href to point to the handler), but as soon as the page redirects and the file is written, same thing happens
edit3: The problem is only happening in Firefox so far. I've tried Chrome and IE and the gif stays animated in those browsers. (latest versions of each)
edit4: If I use an iframe with the src as the image it solves the issue, but it's very hacky and the style of it looks different across all browsers with regards to centering/padding/margins.
edit5: Yeah. If I inspect the frozen gif with firebug it magically unfreezes itself.
I managed to recreate the problem in firefox and I really can't find a way to "unfreeze" the gif. When I added a completely different file after a download and that too was frozen I gave up with that approach.
What I did instead was to test different ways to trigger the download. I found no window.location solutions that worked, what did work though was this:
window.open(path + 'users/export/' + parm1 + '/' + parm2);
window.open opens a new tab and downloads the file through that instead of the current tab as window.location does. It will return to the current tab as soon as the download starts.
Edit
You could also use a hidden iframe:
var iframe = document.getElementById('iframe');
iframe.src = path + 'users/export/' + parm1 + '/' + parm2;
I confirm that I have the same behavior with firefox, and the first that come to my mind is to use SetTimeOut but still the same behavior, so on firefox for some reason, this window.location.href is also call the "Stop" on browser, that this cause the gif animation to stop.
So what I found and you can solve your issue, that this is not happends on simple links.
And if you change your code you can archive the same effect with a link.
So change this
$('#lnkExportToPDF').click(function (e) {
e.preventDefault();
window.location.href = "page.aspx";
});
to something like this
$('#lnkExportToPDF').attr("href", "page.aspx");
and you have the same results, and gif will still moving.
Here is the fiddle test.
On the test I add to move to paypal, because is slow moving and you can see the animation stop or not, also pp not let show on iframe, so on example you stay on example and not load the page.
When you click on this example, the issue is appears only on firefox !
http://jsfiddle.net/hn7S9/4/
One other issue that I think is that if you need to make your parametres to the next page on click, you probably need to redesign that and fix them before your click.
This is possible because for sure is not depends on the last click on the dynamic create link. So make the link with their parametres before the click.
You could try an asynchronous approach on the click to allow the browser to parse the event queue after the click has initiated:
$('#lnkExportToPDF').click(function (e) {
e.preventDefault();
setTimout(function() {
window.location.href = path + 'users/export/' + parm1 + '/' + parm2;
}, 20);
});
How about allowing the link to actually fire, but opening it in a new tab?
That shouldn't interrupt anything about the gif, and is semantically fine, other than I guess it would leave a tab open. You could get rid of the content-disposition, and allow the browser /user to decide what to do with it though.
<a id="lnkExportToPDF" target="_blank">Export</a>
$('#lnkExportToPDF').click(function (e) {
$(this).attr("href", path + 'users/export/' + parm1 + '/' + parm2);
});
Instead of setting the window.location.href, you can use a form with method="get" and submit it. This form could either be coded into your HTML or created dynamically. See this Answer:
https://stackoverflow.com/a/21742326/1614903
Here's my solution. It's faster and easier than any fix or workaround I've found. Just open the problem page in Chrome. Chrome has it's own problems, but this isn't one of them. Whenever I encounter a page full of gifs that causes Firefox to freeze, I just copy the URL, close the tab, open Chrome, and paste in the URL. I works every time! :o)

iPhone WebApp opens links in safari

When I add my 'web app' to my home screen on my iPhone, then open it and click a link, it opens Safari.
I've found a couple of solutions to my question but they don't seem to work:
iPhone Safari Web App opens links in new window
$('a').live('click', function (event)
{
var href = $(this).attr("href");
if (href.indexOf(location.hostname) > -1)
{
event.preventDefault();
window.location = href;
}
});
http://jakeboyles.com/2011/01/16/how-to-build-an-iphone-and-ipad-web-app/
<a ontouchstart="window.location=yourlink.html' ">Your Link</a>
Both of these posts/tutorials were written before iOS5. Is there a new method? Am I doing something wrong?
Appreciate your help
One idea is to make your home screen app an iframe, and making all anchors target it. No javascript needed.
Alternatively:
$('a').on('click touchend', function(ev){
$(this).preventDefault();
window.location = $(this).attr('href');
});
Never use "touchstart" for something like links. You only want to detect when the user stops touching the link. Same thing for detecting key presses, mouse clicks, etc. Its the end of the event you want to detect.
.live has been deprecated in the latest versions of jQuery, so use .on() from now on and it wraps seamlessly around extant and non-extant elements.
This javascript code works for iOS 5 (it worked for me):
In the head tag:
<script type="text/javascript">
function OpenLink(theLink){
window.location.href = theLink.href;
}
</script>
In the link that you want to be opened in the same window:
Link
The code is based on this comment: http://mobile.tutsplus.com/tutorials/iphone/iphone-web-app-meta-tags/comment-page-1/#comment-10699
This worked fine on the iPhone 5
$(document).ready(function(){
// Stop the default behavior of the browser, which
// is to change the URL of the page.
$("a").click(function(event){
event.preventDefault();
// Manually change the location of the page to stay in
// "Standalone" mode and change the URL at the same time.
window.location = $(this).attr('href');
});
});
Remember to link to the newest version of jQuery.
Im the one that wrote the article you are referring to. I still use my javascript method and it works fine for me. The touchstart works fine for web apps as it takes a little longer for the browser to render it. If you are planning on makign a native app then don't use it, but I have used touchstart for many apps and it works fine.
Thanks
Jake Boyles

Categories