I am trying to make a javascript that goes makes <a> go to another link, rather than the one specified in its href. E.g. I want
<a href="http://www.example.com/some-page">
To go to instead:
http://www.newexamplesite.com/http:%252F%252Fwww.example.com%252Fsome-page
Unfortunately I don't have access to jQuery for this application. Has to be pure javascript.
I'm looking for some javascript that can be included within the actual <a> tag:
<a onclick="" href="http://www.example.com/some-page">
Note that the original link has to be detected and all / is needed
to be replaced with %252F
Try this:
<a onclick="window.location.href = 'http://newlink.com/' + encodeURIComponent(this.href); return false;" href="http://www.example.com/some-page/">Go to new link</a>
Try the following:
<a onclick="event.preventDefault();location.href='http://www.uol.com.br/'" href="http://www.example.com/some-page">Link Text</a>
The event.preventDefault should stop the anchor element's default behaivour (ie - directing the user to the site within the a href.
EDIT: forgot parentheses on function call!
You should prevent a default event (i.e. going to the link specified by href) and go to another link.
<a onclick="event.preventDefault();location.href='http://www.newexamplesite.com/'+this.href.replace(/\//g,'%252F')"
href="http://www.example.com/some-page">
test
</a>
You can replace the href URL with a function call like this:
<a href="javascript:goToLink()" />
<script>
function goToLink(){
// your link selection logic goes here
.....
// when you have selected the link you want to go to assign it to the window location.href attribute and the browser will redirect the user to the specified link
window.location.href = "..selected link...";
}
</script>
Related
I'm trying to open the link in popup, i've write this static html code :
<a href="http://www.google.com" target="popup"
onclick="window.open('http://www.google.com','popup','width=600,height=600');
return false;"> Open Link in Popup
</a>
this code works, it open the link in popup.
But, if i want to add this code in javascript (with jquery) like this :
$('#services').append("<li><a href='http://www.google.com' target='popup' onclick='window.open('http://www.google.com','popup','width=600,height=600'); return false;'>Open Link in Popup</a></li>");
The link is opened in new tab and not in popup.
Why ?
Check this example on jsfiddle - Problem is in quotes
$('#services').append("<a href='http://www.google.com' target='popup' onclick=window.open('http://www.google.com','popup','width=600,height=600'); return false;>Open Link in Popup</a>");
You missed to escape the quotes in onClick of your jQuery. Update the script as below.
$('#services').append("<li>Open Link in Popup</li>");
Change your algorithm, instead of putting the javascript inside onclick, add a class or ID, with data-, so you can attach your jQuery event handler on that class/ID, and use the data to create new window. Imagine the data as data-destination="http://www.destination".
That should fix your problem.
The following works:
<a id="showDirectionsMapLink" href="#" onclick="href='comgooglemaps://maps.google.com/maps?saddr=Google,+1600+Amphitheatre+Parkway,+Mountain+View,+CA+94043&daddr=Google+Inc,+345+Spear+Street,+San+Francisco,+CA¢er=37.422185,-122.083898&zoom=10';">test</a>
It opens in the google maps app.
The following does not work:
<a id="showDirectionsMapLink" href="#" onclick="showDirectionsMap();">test2</a>
showDirectionsMap() function will get the location of the accounts selected and return the same exact string as above.
href='comgooglemaps://maps.google.com/maps?saddr=Google,+1600+Amphitheatre+Parkway,+Mountain+View,+CA+94043&daddr=Google+Inc,+345+Spear+Street,+San+Francisco,+CA¢er=37.422185,-122.083898&zoom=10'
Nothing happens
If you want the URL returned by the function to be used, you have to assign it to this.href, just like you did in the version where you used a literal string.
<a id="showDirectionsMapLink" href="#" onclick="this.href = showDirectionsMap();">test2</a>
html
<a id="showDirrectionsMapLink">your link</a>
JS (uses JQuery):
function forceLink(event){
event.preventEvent();
event.stopPropagination();
var link = 'http://google.com'; // whatever you want
window.location.href = link; // automaticly forces the browser to this location
}
$('#showDirrectionsMapLink').on('click' forceLink);
if you want to use a onClick on the a tag, you need to stop standard execution and redirect by hand. the standard execution reads the href before your changes
To handle swiping I use the script posted here:
http://padilicious.com/code/touchevents/
It works fine.
Now instead of changing the background (what the original script does), I would like it to grab the link contained within an <a> which has a class, and which is normally a link to the next page, but for mouse events like so:
<a href="mypage02.html" target="_self" class="NextP" title="My Second Page">
and then load the page.
I have many pages, with the same structure, I don't want to manually define the links. I want the js to get hold of the current href contained in the <a> and launch it, when triggered by the swipe. If possible.
Thank you ;-)
From what I understand, you want to look for a
<a href="http://example.com/" class="NextP">
element in a page (an <a> anchor tag with a NextP class), and when the user swipes, visit that link.
To do this, I would
look through your HTML for an a.NextP element, and capture its href attribute.
when the user swipes, set window.location.href to this attribute.
window.onload = function(){
var nextPageUrl = document.querySelector('a.NextP').href;
// just guessing how swiping works, I haven't looked through your library
document.body.onswiperight = function(){
window.location.href = nextPageUrl;
};
};
Of course, you would use the correct method of detecting the swipe.
New to jquery. I'm trying to show/hide function with link, but its not working completely. is it loading problem?
I need
<a href='127.0.0.1/example/1' class='show_hides1'>click me</a>
Not
<a href='javascript:void(0);' class='show_hides1'>click me</a>
have any Idea? Suppose, I stay in 127.0.0.1/example and I need to go 127.0.0.1/example/1 and steel need show/hide. both page has my hide content. how can I do that?
To show/hide elements using jQuery, use the following:
$(document).ready(function() {
$(".show_hides1").click(function() {
$("<somethingtoshoworhide>").toggle();
});
});
Also, remove the href entirely, or also add return false; to the end of your click function so that it does visit the specified href page.
I am executing this line from a function -having this code only- that is called on onclick event on a link.
document.getElementById("backButton").href="javascript: history.go(-1);"
But this is not working for IE 7. Can anyone help me on this? Here is the other part of code:
<a id="backButton" title="Go Back To Previous Page" href="./inmaking.html"
onclick="goBack();" onmouseover="status=''; return true;"
style="background-color:#CCCC00;" >here</a> to go back to previous page.
location.href = document.referrer;
Try this instead:
<a id="backButton" title="Go Back To Previous Page" href="javascript:history.go(-1)" onmouseover="status=''; return true;" style="background-color:#CCCC00;" >here</a> to go back to previous page.
Your link has a default href value. To prevent the browser from entering it, you need to add return false; to end of the onclick.
onclick="goBack(); return false;"
Needless to say that stepping in browser history using JS like that is a poor practice. Rather store the last requested URL in the session scope or as a hidden input field and finally dynamically populate the link's href with that using whatever serverside language you're using.
This one helps for me:
history.back();