So ostensibly I'm trying to make a button or a link who's target is contingent on the current page's URL. I'm working on a Wordpress portfolio site that opens up different projects in an Ajax window, but I also want to be able to link to the separate project page from that window. For instance, if I click the thumbnail for a project titled "Blue" it opens up the project in the ajax window and the url changes to "www.website.com/#blue." Incidentally, the url of the corresponding project page would then be "www.website.com/projects/blue". The idea is to hardcode the button into the Ajax window and write a script that generates the correct URL for the project page so my client doesn't have to copy-paste the code for the button and update the target URL every time she posts a project. This is what I came up with, but I'm not great with Jquery or Javascript and I think something might be wrong with my syntax or the structure of the script. Right now, nothing happens when I press the button.
First it splits the url at each "/" and creates an array from the different strings, then it removes the "#" from the unique string, and opens a new window with the new address.
EDIT There were some syntax errors, but it's still not working. Any thoughts on this new version:
$(".comment_button").click(function(){
var parse_url = window.location.href.split('/');
var project_name = parse_url[2].replace("#", "");
window.open("http://www.balletinform.com/projects/" + project_name);
});
Tried using a element ?, with target="_blank" attribute ?
<a id="blue" href="www.website.com/projects/blue" target="_blank">blue</a>
If I understand correctly, what you want to get is the #blue part of the url.
If so, you can use window.location.hash.
Your function will then looks like window.open("http://www.balletinform.com/projects/" + window.location.hash.substring(1));
Your current function was setting project_name to "www.balletinform.com" ([0]=>"http:"; splitted(/); [1]=>""; splitted('/'); [2]=>"www.balletinform.com"; splitted('/'); [3]=>"#blue").
So an alternative solution would have been var project_name = parse_url[parse_url.length-1].replace("#", "");
var new_url=""+(window.location.href).replace('#','projects/');
window.open(new_url);
Try replacing # with 'projects/'
Related
I'd like a bookmarklet that takes info from my current url (like these):
https://www.themoviedb.org/tv/88396-falcon-winter-soldier
https://www.themoviedb.org/movie/64688-21-jump-street
https://www.themoviedb.org/person/7447-alec-baldwin
Extracts just id portion, the first set of numbers (88396, 64688, 7447, etc) and appends it to a new url like this:
https://webhookurl.com/webhook?movieID=(id from url)
Which opens in a background tab ideally.
I'm super new to javascript, been trying to cobble something together from similar answers on here but unable to figure it out. Any help is very much appreciated.
update: thanks to some help here with the regex and tinkering until i got the other tab thing to work, i now have a finished bookmarklet that works. thanks
ud2: changed again to 1. match urls with no '-film-name' after the id number, and also to open in a small new window rather than new tab so i can easily close after the webhook is accepted and it doesn't obstruct my view of the page
javascript:(function(){ open(window.location.toString().replace(/^https:\/\/www.themoviedb.org\/.*?\/([0-9]+)-?.*/, 'https://fakewebhook.com/webhook?movieID=$1'), "", "width=400, height=200");})()
You may use regex to form the new url from the given url.
'https://www.themoviedb.org/tv/88396-falcon-winter-soldier'.replace(/^https:\/\/www.themoviedb.org\/tv\/([0-9]+)-.+/, 'https://webhookurl.com/webhook?movieID=$1')
I've once used jQuery UI in order to add the tab feature to one of my project.
Everything was working just fine, and I noticed each tab was bound to a URL hash tag (I do not know you say it in english). As an example, once I clicked on the first tab, #Tab0 was added to my URL.
I want to reproduce this behavior in my current project. But I'm not using jQuery UI tabs, I am porting a desktop application and there are JavaScript buttons which write and replace content inside my page (in the manner of different pages, but without reloading).
How do I proceed to mimic this behavior ? Do I have to manually fetch the tag in the URL and do things accordingly all by JavaScript ?
Thanks,
u could do it this way:
creating an url with hash from current url:
var url = window.location.href + '#Tab0';
reading a hash from current url:
var hash;
if (window.location.href.indexOf('#') > -1)
{
hash = url.split('#')[1];
}
you can do this by using location.hash:
//you can set hash
location.hash = "something";
//and read it eg. http://domain.com#something
console.log(location.hash); //will return the current hash value 'something'
Also you have to remember that if your anchor tag has hashed href attribute e.g. <a href="#something"> it will be appended automatically to current url and browser will try to find given id on the page. Of course you can prevent that default behaviour.
I am developing my own template selector for CSS templates. At the moment, it works fine, clicking on a name from the selectbox changes the template. However there is 1 function that is missing.
If you look here: http://www.demo.joomforest.com/?template=corporate
you can obviously see the URL contains ?template=corporate at the end of it, thus if you enter that URL, it loads the corporate template.
This is my selector so far: http://joomjunk.co.uk/demo
As you can see, I added a hash + template name to the end of the url upon selecting a template, however if you copy and paste that URL into a new tab for example, it loads the default template.
So my question is, how can I add something similar to ?template=corporate and have it load the correct template upon loading that specific URL?
I'm not asking for the full code, but to point me in the right direction.
Thanks in advance.
window.location.search
This will contain whatever comes after the ? in your URL, including the ?
if
window.location.href === "http://www.demo.joomforest.com/?template=corporate"
then
window.location.search === "?template=corporate"
if you want to parse the query string, there are many resources available. If, however, you just want to do it for this specific case:
var tmpl = window.location.search.split('=')[1];
// tmpl === "corporate"
This will split the string on = and then return the second element in the array
If you have an URL like http://foo.bar/#corporate you can just check the window.location.hash in your javascript and load that template immediately.
Seems reasonable since you already add hashes in your dropdown – the user will see the same template if they choose to refresh the page.
You might even be able to trigger a click event on the right dropdown menu item based on the hash property, but that would require the DOM to be fully loaded.
I am trying to get a variable from a URL,
for example if the users can link to this page: www.example.com?var1=blabla&var2=blabla
and there are many links on this site www.example.com.
What I want is no matter where my users click, they will always see the link appended with 2 variables they got from this link www.example.com?var1=blabla&var2=blabla
for example: if there is another link
<a href="www.example.com/page1.php"/>Go to page1</a>
on www.example.com?var1=blabla&var2=blabla, they will go to page www.example.com/page1.php?var1=blabla&var2=blabla.
This is my code:
<script type="text/javascript">
$(document).ready(function() {
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1);
var links = $('a');
links.each(function(){
var curLink=$(this);
var href = curLink.attr('href');
var newhref = href +'?'+ hashes;
curLink.attr('href',newhref);
});
});
</script>
My question is: I can only make all the links on the same page append those 2 variable. If the users go to another page, it won't do the same thing, because there is no script on it... but I can't add same script on every pages...
And another question, I want to clear the things after question mark and append the new ones.. is that possible to do that?
Thanks!
Your code looks good to me. And from your question it appears that your problems lie outside this.
My question is: I can only make all the links on the same page append
those 2 variable. If the users go to another page, it won't do the
same thing, because there is no script on it... but I can't add same
script on every pages...
If you can't run your script on every page then you can't modify the url's. You will need to do it server side. If you can't do it server side then you are out of luck.
And another question, I want to clear the things after question mark
and append the new ones.. is that possible to do that?
Yes, that is certainly possible. To strip the querystring use the following code.
var strippedHREF = window.location.href.substring(0, window.location.href.indexOf('?'));
I'm looking for a simple bookmarklet to take the current URL of my website and refresh it with a couple of changes. For example:
Take the current page: http://www.example.com/pages/
and change it to: https://admin.example.com/pages/
then load that new URL.
I tried searching for a bookmarklet that can do this but I couldn't find one. Can anyone point me in the right direction? Even a bookmarklet that does something like this that I can edit to suit my needs.
Just change window.location, e.g.
window.location=window.location.toString().replace(/^http:\/\/www\./,'https://admin.')
The full bookmarklet would then be:
javascript:(function() {window.location=window.location.toString().replace(/^http:\/\/www\./,'https://admin.');})()
For example you could replace a part of the string using the replace method with a regular expression.
javascript:location = location.href.replace(/http:/g, "https:" )
The above will assign the new string value to the location and trigger the page reload.
This one will change the site name
javascript:(function() {document.title=prompt("Enter Page Title");})();