I am ashamed to say that I have an anchor issue.
So I have this code:
<a name="map"></a>
$("div.store_list").click(function() {
//do some stuff
location.href = location.href + '#map'
});
When doing the first click it works fine. And the URL changes to:
http://mydomain.local/stores#map
Second click the URL changes to the following and it doesn't work:
http://mydomain.local/stores#map#map
Any suggestions? Thanks
In case you scroll and need to jump again, this has worked for me:
onclick="location.hash=''; location.hash='#map';"
Try location.hash instead, e.g.
location.hash='#map'
Issue was solved using: document.location = "#map";
You can check to make sure the URL doesn't already contain the value you're appending:
$("div.store_list").click(function() {
//do some stuff
if (location.href.indexOf('#map') == -1) {
location.href += '#map';
}
});
The accepted solution didn't work for me sadly. I managed to get it to work in Chrome by setting the anchor value to "#" first, then setting it to my desired location.
document.location.href = "#";
document.location.href = "#myAnchor";
Once I did this, it fired every time I click a link with an anchor tag in it.
$(document).on('click', '.jump_to_instance', e => {
// Get anchor name
var anchorName = $(e.target).attr("href");
// Set anchor to nothing first
document.location.href = "#";
// Set to new anchor value
document.location.href = anchorName;
});
Click me to go to anchor, I should work multiple times
<div id="myAnchor">Will jump to here</div>
Reseting the scroll position on anchor link click event worked for me.
Seems like theres at least one bug with anchor links in Chrome versions 76 - 86 (The most recent macOS version at time of this posting).
Try:
window.scrollTo(0, 0)
Related
I am using the following code to change href links in a page to a new link by using their id.
This is what I'm using to find the href and add the id to it;
$( document ).ready(function() {
$('a[href$="/truck-bed-covers/camper-tops"]').attr('id', 'camper1');
});
And this is what I'm using to change the link.
$(document).ready(function () {
$("#camper1").attr("href", "../camper-tops");
});
It works great. Except it doesn't continue on the rest of the page. It only changes one link and then it's done. How do I continue until there is no more links to change?
ID has to be unique, else JavaScript works with the first one only.
$(document).ready(function() {
$('a[href$="/truck-bed-covers/camper-tops"]').each(function(){
$(this).attr("href", "../camper-tops");
});
});
But I don't think this is the right way. You should find place where you create incorrect links and repair it there (in PHP/DB or where links came from).
At a guess, you're adding the ID so you can refer to the element in the second line, but you don't need to. Once you have an element you can work on it.
You can select all links with something like $('a[href]') (all links with an href attribute) and then iterate over all of them with jQuery's each function. Something like
$(function(){ // shorthand for $(document).ready()
$('a[href]').each(function(index, element){
// work on each element here
var $el = $(element);
$el.attr('href', $el.attr('href').replace(/*whatever you want to do here */);
});
});
If the user clicks the link, then I would like to open a page in a new tab, and jump to #section on the parent site. How is it possible without JS?
This doesn't work:
html
<a href="#section">link</a>
AFAIK, you have to use JavaScript to request multiple URLs via the same anchor.
Some Text
With JavaScript, you would be able to watch for the onclick event to open a new window, like so:
document.getElementById("doubleLink").onclick = function() {
window.open("http://www.someothersite.com/");
}
Simply add #section to the address.
<a href="http://target_site#section">
I think you need to use javascript, but not much:
document.getElementById('myLinkId').addEventListener('click', function() {window.location = '#section'}, false);
EDIT: As far as I know, it can't be done without javascript. What would happen to a double link that didn't open a new tab?
I realize you may also need it to work in older IE.
var doubleLink = document.getElementById('myLinkId');
if (window.addEventListener) {
doubleLink.addEventListener('click', function() {window.location = '#section'}, false);
} else {
doubleLink.attachEvent('onclick', function() {window.location = '#section'});
}
I found very strange problem in Chrome when using # in URL. If # doesn't exist - it's Ok, but when I set #something - page is loaded, tinyMCE is still loading (focus is on the top) and after complete and textarea changed to rich text editor then focus is changed to the middle of page. DO you have any suggestions how to fix it?
Thanks :)
This should do the trick:
$(document).ready(){
document.location.href = "#";
};
Another try: Put this in your tinymce init function
setup : function(ed) {
ed.onInit.add(function(ed, evt) {
document.location.href = "#";
});
},
I have a dynamic HTML table, where I can add and remove rows.
Each row contains a button that has a class removeRow.
In my JavaScript, I have:
$('button.removeRow').live("click", function () {
var row = $(this).parents('tr')
row.remove();
return false;
});
The problem is that it works for all buttons that belong to rows that were inserted after the page was loaded (by clicking on 'Add row' button).
It works for existing buttons, only if I change the above code to (but then it does not work for dynamically added rows):
$('button.removeRow').click(function () {
var row = $(this).parents('tr')
row.remove();
return false;
});
I think that the live function should work for both, so can you point me into the right direction? Where can it go wrong?
OK I found a bug today. Somewhere in my code I had:
$('input[type=submit], button').click(function () {
return false;
});
I wanted it to work with the submit button, so it would not submit the form on click. I do not remember why I put button there. Anyways, because of that my static button clicks were attached this event, while dynamically created ones were not. Therefore live 'click' worked for dynamic buttons. Stupid mistake...
Hacky solution: Do both
$('button.removeRow').live("click", function () {
var row = $(this).parents('tr')
row.remove();
return false;
});
and
$('button.removeRow').click(function () {
var row = $(this).parents('tr')
row.remove();
return false;
});
It would be helpful if you posted some example HTML as well as the code responsible for inserting new rows, though.
Maybe something is going wrong if other tr elements are matched by your .parents() selector. Try .closest():
$('button.removeRow').live("click", function(){
$(this).closest('tr').remove();
return false;
});
The live should work for both dynamic and pre-rendered elements.
I'd start by working out if that content really exists before that jQuery is run...Try outputting the result of the following somewhere, or use the debugger keyword, or even the dreaded alert:
$('button.removeRow').length
// The rest of your click handler definition...
I have a html page A and a link in the page which opens up page B in a new window. How to reload the page A on clicking and opening this link ?
EDIT:
I should have been more clear. Page B opens in a new window and not as a popup. The hyperlink in question has its target attribute set to _blank. Taking a clue from the answers that I got (Thanks guys !), I tried setting onclick = "window.location.reload()" and it works perfectly fine.
However I have a problem. In fact another question altogether. How to make sure that the reload of page A waits until the page opened in the new window (page B) loads ?
Something like this:
open page b
The simplest way would be to do
link
If I remember correctly that should open the window and then since the return has not been suppresed will reload load the page.
I am not exactly sure if this is what you want based on your wording, but if you want to reload the opening window from a link in the popup try
self.opener.location.href = self.opener.location.href;
Edit, based on your new comments just use the code above in the body onload of the new window
<body onload="self.opener.location.href = self.opener.location.href;">
You can use setTimeout() to delay the reload.
Try this:
<script type="text/javascript">
function openPage(elem) {
function reloadCurrentPage() {
location.reload();
}
var page = window.open(elem.href, '_blank');
page.onload = function() {
reloadCurrentPage();
}
if (/MSIE/.test(navigator.userAgent)) { // fix for IE
var timer = setInterval(function() {
if (page.document.readyState == 'complete') {
clearInterval(timer);
reloadCurrentPage();
}
}, 100);
}
}
</script>
<p>second.html</p>