If i have multiple links on a website, is there a way that if they are clicked they can be transferred to another website? All the links can be the same, but when either one is clicked they transfer over to the same page.
I'm trying to find an event that cancels the bubble when the event is clicked but can't find one.
Say for example I have
google
when that link is clicked then it will cancel the google.com transfer and open yahoo.ca
Using jQuery you could bind a click handler that prevents the default, and instead redirects the page, like so.
$('a').click(function(ev) {
ev.preventDefault();
window.location = "http://www.example.com"
});
If you mean you can have any href in link and you click any of links in page, then you need preventDefault:
$('a').click(function(e){
e.preventDefault();
window.location = 'http://yahoo.ca';
});
Related
I want to click on this element.
ini
There are other elements, just like that where only the href changes. I can correctly find the element I want. But cannot click it...
I tried the usual click() but didn't work:
document.getElementsByClassName("btn")[1].click()
Any help?
I tried this, it opens the same window, but I want to open in a new tab. I also put the internet option to open tabs with popups:
b=document.getElementsByClassName("btn")[1].href;
window.location.assign(b, '_blank');
How to open in new tab? I tried window.open() but never got to make it work:
window.open(b, '_blank');
You can find the answer here How can I trigger a JavaScript event click. If you execute the .click() function, you trigger all the listener that are bind on the 'click' ( .onClick ).
Try to listen for the click event and then execute the .click() function
I'm not really sure i understand the question all the way. But when you actually click a link all other JavaScripts stops loading and you get to that webpage. The window.open is right. But you have to prevent the Url to actually redirect you to the website. You can do this by using preventDefault on the eventobject that fires on your click. Hope this helps
let myLink = document.getElementsByClassName("btn")[1];
myLink.addEventListener('click', function newWindow(event) {
event.preventDefault();
window.open(this.href, '_blank')
})
myLink.click();
I need to capture the event that occurs when a user clicks a link on my chat application. I am using IE11.
Is there a way to capture the user clicking the link, when such a link could be dynamically added to the chat box (i.e. user sends "www.google.com" message) at any given time?
I have been using onbeforeunload by the way and while this detects the browser close event it will not detect the link click event, I am not sure why, so I was thinking that a jquery solution that checks the links on the page for an onclick could solve my problem...
Thanks,
dearg
Yes, you can use event delegation like:
$("#chatWindow).on('click', 'a', function () {
//do something
});
You could do it with a function like this:
$('a').on('click', function(){
//track clicked link here
return true; //to allow following the link this is the default behavior no need to add
return false; //prevent default behavior
});
I have a link in my page.
<a onclick="Click()">Click me</a>
When I click this link, fires onclick event that call Click function. In this function, I have some javascript code and then, I want to redirect to another page.
function Click() {
//some code
window.location = url;
}
When user right click on link and select "Open in new tab", new tab opens, and url is: "about:blank".
How to I correct this?
Thanks.
The key is not to replace anchor functionality with Javascript. Anchors are designed to take you to a new URL. If you have an anchor, use it as an anchor (eg, set a href on it). Don't bind a click event that uses window.location to redirect to a new url.
Your current anchor has no href. So when you try and open it in a new tab, there's no surprise that nothing loads. You're literally opening nothing in the new tab.
If you really need to set the URL dynamically, then change the href of the element using javascript. For example:
document.getElementById('my-element').href = new_href;
It goes without saying that this needs to be done before the anchor is clicked (not on click). For example, on window.load, or the completion of the function that generates the dynamic URL.
Use window.open function and pass _blank in second argument function
function Click() {
//some code
window.open(url,'_blank');
}
you should correct your anchor tag to be something like this:
link text
this way when user click on the link it'll open in new tab and you'll execute the Click function.
There is a clickable layer. On click it reveals/hides some extra content. Within this layer there is a link which triggers another page to load in the browser.
When this link is clicked the clickable layer is clicked too because it contains the link. How can I avoid that?
I want the link to work but while the user clicks on it the extra content should not be shown.
I tried with
$('.link').click(function(event){
return false;
});
but this disables both hide/show and the link to work. Any ideas? Here is my fiddle: http://jsfiddle.net/ZkPLD/
Use stopPropagation to avoid events bubbling up:
$('.link').click(function(event){
event.stopPropagation();
});
I have jQuery that I have written that is supposed to find a particular <a> tag and change its behavior. Before jQuery loads, the <a> tag has an href attribute that points to another page. I am using jQuery to change the behavior of the <a> tag so that rather than directing the browser to load that other page, it instead runs javascript when clicked that loads content dynamically in a <div> that is positioned at the location of the mouse pointer.
So, for example, I have the following:
<a class="funk" href="http://example.com/page2.html">Link</a>
<div class="hidden bubble">Load this instead.</div>
The jQuery I have running does the following:
$(document).ready(function(){
$('.bubble').hide()
$('.bubble').removeClass('hidden');
$('.funk').attr('href', '#');
$('.funk').click(function(e){
$('.bubble').show();
})
})
The problem I have is: Whenever the user clicks the link, the browser acts on the href="#" attribute and brings scrolls the browser to the top of the page. What is the most "correct" way to make my site so that the browser does not scroll at all, but instead merely executes the jQuery code that I have written for the click event?
Let the 'click' function return false. That cancels the event, and the browser doesn't follow the link. In this case, you can even let the href attribute at its original value.
$('.funk').click(function(e){
$('.bubble').show();
return false;
//--^
})
To be on the save side, you can explicitly cancel the event:
e.preventDefault(); // no default action
e.stopPropagation(); // event doesn't bubble up or down in the DOM
Add this to your click function:
$('.funk').click(function(e){
e.preventDefault();
e.stopPropagation();
$('.bubble').show();
});
This will do what is implied by the method names.
Call e.preventDefault() in the click handler.
http://api.jquery.com/event.preventDefault/