I have a web page with a jQuery lightbox that opens automatically on page load. In the lightbox I have implemented the Facebook Like button (this is a 2 click solution for Facebook Like button in email). Now, when a Facebook user visits my web page by clicking on the "Liked" URL on Facebook I want to turn off the lightbox. I don't want to have to create two different pages (one with lightbox turned on and another turned off) and I think I can avoid this by adding a parameter to the URL with Javascript then turn the lightbox on/off based on that parameter. Is this a safe way to do this? How would I do this?
You can get URL params with this JS function that I found here:
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
Then *add use ?lightbox=1 e.g www.example.com?lightbox=1 and read it with the above function:
if(getUrlVars()["lightbox"]=="1"){
//...
}
*to add parameters you can either:
Change the a link href attribute element.href = "http://www.newURL.com?param=1"; and wait for the user to click them
Redirect to the new location window.location.href = "http://www.newURL.com?param=1";
I believe this is the rough code you're after:
<script type="text/javascript">
document.location="http://example.com/index.php?noLightBox=1";
</script>
Then on index.php, you'd want something such as:
<?php
function isset_or(&$check, $alternate = NULL)
{
return (isset($check)) ? (empty($check) ? $alternate : $check) : $alternate;
}
function getGETPOST($var)
{
return isset_or($_GET[$var],isset_or($_POST[$var],"Empty"));
}
?>
Example:
if(getGETPOST('noLightBox') != 1) {
// Code to display the light box comes here.
}
// Else normal page code
Hope this was helpful!
Source: http://php.net/manual/en/function.isset.php
& W3School's tutorials on PHP
Related
I'm building a photography portfolio website on Wordpress using this theme: http://wpshower.com/themes/expositio/ . The theme hasn't been updated in years but still works smoothly. I have an issue with assigning target="_blank" to some external links though. The option is there but it has no effect whatsoever.
I've looked for advice and have tried every available plugin that addresses the problem, with the best result being opening the external link in both a new tab and the current tab.
I've looked into all the theme files, they are not many, and thinking that this is a javascript issue, I have identified the following code. It deals with the mobile menu animations but it's the only mention of links.
It was also discussed in a similar thread in here: Wordpress navbar links using href="#" not working as a dummy link
$('a').on('click', function(e) {
e.preventDefault();
var _this = $(this);
// close mobile menu if it's open, redirect otherwise
if (_body.hasClass('toggled-on') && _this.parents('#page').length == 1
&& _this.parents('#primary-navigation').length == 0
) {
load_effect.menuOff();
} else {
load_effect.loader.show();
var href = $(this).attr('href');
$('.site').css('opacity', 0);
setTimeout(function() {
window.location = href;
}, load_effect.duration);
}
Finally, here is website using the same theme where the external links do open in a new tab: http://www.tokyogoodidea.com/
I'd be grateful for any advice on solving this little glitch. I'm not good at all with js and don't know what to change.
Here's my project's link: http://one.clrblnd.com/
Thanks in advance.
There seems to be no reliable way to open a new tab in Javascript (a quick search tells it could be tricky), and the code indeeed looks like it is blocking a new page being opened. You can probably try if this works.
Firstly after this line
var href = $(this).attr('href');
add another line that says (this line gets the value of target attribute/properties from the tag, and assumed to be _self if undefined)
var target = $(this).prop('target') || '_self';
Then look for this line
$('.site').css('opacity', 0);
What it does is to make the whole page blank essentially. You may want to do something with this, for example wrap it in a if statement so it doesn't execute when target="_blank". A quick way to fix it is by replacing it to
target === '_blank' || $('.site').css('opacity', 0);
Next replace (just a few lines after the previous one)
window.location = href;
with
window.open(href, target)
The respective block should look like
load_effect.loader.show();
var href = $(this).attr('href');
var target = $(this).prop('target') || '_self';
target === '_blank' || $('.site').css('opacity', 0);
setTimeout(function() {
window.open(href, target)
}, load_effect.duration);
This is asuming window.open works as expected (documentation is here). What happens in the code is that the author stopped the default behavior after clicking a link with
e.preventDefault();
in order to allow some fancy animation to complete before the browser proceeds to load the intended page. However by simplifying the page load with
window.location = href;
it ignores the target attribute/property of the respective <a /> tag.
Is it possible to call a javascript function from the URL? I am basically trying to leverage JS methods in a page I don't have access to the source.
Something like: http://www.example.com/mypage.aspx?javascript:printHelloWorld()
I know if you put javascript:alert("Hello World"); into the address bar it will work.
I suspect the answer to this is no but, just wondered if there was a way to do it.
There isn't from a hyperlink, no. Not unless the page has script inside specifically for this and it's checking for some parameter....but for your question, no, there's no built-in support in browsers for this.
There are however bookmarklets you can bookmark to quickly run JavaScript functions from your address bar; not sure if that meets your needs, but it's as close as it gets.
You can use Data URIs.
For example:
data:text/html,<script>alert('hi');</script>
For more information visit: https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs
Write in address bar
javascript:alert("hi");
Make sure you write in the beginning: javascript:
/test.html#alert('heello')
test.html
<button onClick="eval(document.location.hash.substring(1))">do it</button>
you may also place the followinng
<a href='javascript:alert("hello world!");'>Click me</a>
to your html-code, and when you click on 'Click me' hyperlink, javascript will appear in url-bar and Alert dialog will show
About the window.location.hash property:
Return the anchor part of a URL.
Example 1:
//Assume that the current URL is
var URL = "http://www.example.com/test.htm#part2";
var x = window.location.hash;
//The result of x will be:
x = "#part2"
Exmaple 2:
$(function(){
setTimeout(function(){
var id = document.location.hash;
$(id).click().blur();
}, 200);
})
Example 3:
var hash = "#search" || window.location.hash;
window.location.hash = hash;
switch(hash){
case "#search":
selectPanel("pnlSearch");
break;
case "#advsearch":
case "#admin":
}
Using Eddy's answer worked very well as I had kind of the same problem.
Just call your url with the parameters : "www.mypage.html#myAnchor"
Then, in mypage.html :
$(document).ready(function(){
var hash = window.location.hash;
if(hash.length > 0){
// your action with the hash
}
});
you can use like this situation:
for example, you have a page: http://www.example.com/page.php
then in that page.php, insert this code:
if (!empty($_GET['doaction']) && $_GET['doaction'] == blabla ){
echo '<script>alert("hello");</script>';
}
then, whenever you visit this url: http://www.example.com/page.php?doaction=blabla
then the alert will be automatically called.
Just use:
(function() {
var a = document.createElement("script");
a.type = "text/javascript";
a.src = "http://www.example.com/helloworld.js?" + Math.random();
document.getElementsByTagName("head")[0].appendChild(a)
})();
This basically creates a new JavaScript line in the head of the HTML to load the JavaScript URL you wish on the page itself. This seems more like what you were asking for. You can also change the a.src to the actual code, but for longer functions and stuff it becomes a problem. The source link can also link to a JavaScript file on your computer if targeted that way.
No; because it would make links extremely dangerous.
you can execute javascript from url via events
Ex: www.something.com/home/save?id=12<body onload="alert(1)"></body>
does work if params in url are there.
There is a Chrome extension called Bookmarklet URL (no affiliation). To append a URL with JavaScript, so that the JavaScript command is executed just after loading the webpage, one can use ?bmlet=javascript:
Example: Display an alert box
https://github.com/?bmlet=javascript:alert("Hi");
Example: Enable spell-checking while editing a GitHub README file
[Obviously, a spelling checking extension must be originally available.]
https://github.com/<username>/<repositoryname>/edit/main/README.md?bmlet=javascript:document.getElementById("code-editor").setAttribute("spellcheck","true");
On some pages, it might take some time, as the JavaScript command runs after completely loading the page. Simple commands like alert("Hi"); should run quickly.
I am a student and I have just realized my school blocked JavaScript from the address bar. It works with the "a" tag on a .html file but not on the bar anymore. I am not asking for help, I would just like to share this.
You can do one thing that is you can first open the link www.example.com. Then you can search:
javascript:window.alert("Hello World!")
I am trying to get some dynamically loaded links to display via a javascript file and a JSON array(where links are contained).
Link1 is to another webpage, open in new tab is the hope.
Link2 is to a site hosting an mp3 of a sound. Hopefully get the sound to just play in this window, otherwise in a new tab.
My problem is I'm not too familiar with js syntax to know where I'm wrong.
The error is nothing happens: in the status bar at the bottom I see: "#http://etc.com" because of the # hash sign it doesn't show but I need the hash sign for the navigation/local links.
here is the link to what's on the server so you can see the big picture:
wordExplorer
Here is the code:
function SetAnchorProperties(aElemObj, classStr, hrefStr) {
var aStr = arguments[3];
if (aElemObj) {
if ((classStr) && (hrefStr)) {
aElemObj.setAttribute('class', classStr);
if (hrefStr.search("http")) {
(aElemObj.setAttribute('href', hrefStr));
} else {
(aElemObj.setAttribute('href', '#' + hrefStr));
}
console.log(classStr, hrefStr);
console.log(hrefStr.search("http"));
}
if (aStr) {
aElemObj.textContent = aStr;
}
}
}
Thanks so much!!
Cam
So I've been wondering about this for a while.
I'm creating an Edit site for my project, and on this edit site I want the people who have access to the page be able to paste
/watch?v=sometext
into a text box, and have a preview embed player take this string and display the new player for them without loading another page or before they actually submit the URL to the Database.
Try the following javascript function:
document.getElementById("btn").onclick = function()
{
var url = document.getElementById("txt").value;
if (url !== "")
{
var video_id = url.split('v=')[1];
var ampersandPosition = video_id.indexOf('&');
if (ampersandPosition != -1) {
video_id = video_id.substring(0, ampersandPosition);
}
document.getElementById("myFrame").src = "//www.youtube.com/embed/" + video_id;
}
};
That will strip the videoID from an url and play it in a iframe (the one you can get from the share button).
Look at the full example, and paste a full youtube video on the textbox.
http://jsfiddle.net/hescano/URcWZ/
Is it possible to call a javascript function from the URL? I am basically trying to leverage JS methods in a page I don't have access to the source.
Something like: http://www.example.com/mypage.aspx?javascript:printHelloWorld()
I know if you put javascript:alert("Hello World"); into the address bar it will work.
I suspect the answer to this is no but, just wondered if there was a way to do it.
There isn't from a hyperlink, no. Not unless the page has script inside specifically for this and it's checking for some parameter....but for your question, no, there's no built-in support in browsers for this.
There are however bookmarklets you can bookmark to quickly run JavaScript functions from your address bar; not sure if that meets your needs, but it's as close as it gets.
You can use Data URIs.
For example:
data:text/html,<script>alert('hi');</script>
For more information visit: https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs
Write in address bar
javascript:alert("hi");
Make sure you write in the beginning: javascript:
/test.html#alert('heello')
test.html
<button onClick="eval(document.location.hash.substring(1))">do it</button>
you may also place the followinng
<a href='javascript:alert("hello world!");'>Click me</a>
to your html-code, and when you click on 'Click me' hyperlink, javascript will appear in url-bar and Alert dialog will show
About the window.location.hash property:
Return the anchor part of a URL.
Example 1:
//Assume that the current URL is
var URL = "http://www.example.com/test.htm#part2";
var x = window.location.hash;
//The result of x will be:
x = "#part2"
Exmaple 2:
$(function(){
setTimeout(function(){
var id = document.location.hash;
$(id).click().blur();
}, 200);
})
Example 3:
var hash = "#search" || window.location.hash;
window.location.hash = hash;
switch(hash){
case "#search":
selectPanel("pnlSearch");
break;
case "#advsearch":
case "#admin":
}
Using Eddy's answer worked very well as I had kind of the same problem.
Just call your url with the parameters : "www.mypage.html#myAnchor"
Then, in mypage.html :
$(document).ready(function(){
var hash = window.location.hash;
if(hash.length > 0){
// your action with the hash
}
});
you can use like this situation:
for example, you have a page: http://www.example.com/page.php
then in that page.php, insert this code:
if (!empty($_GET['doaction']) && $_GET['doaction'] == blabla ){
echo '<script>alert("hello");</script>';
}
then, whenever you visit this url: http://www.example.com/page.php?doaction=blabla
then the alert will be automatically called.
Just use:
(function() {
var a = document.createElement("script");
a.type = "text/javascript";
a.src = "http://www.example.com/helloworld.js?" + Math.random();
document.getElementsByTagName("head")[0].appendChild(a)
})();
This basically creates a new JavaScript line in the head of the HTML to load the JavaScript URL you wish on the page itself. This seems more like what you were asking for. You can also change the a.src to the actual code, but for longer functions and stuff it becomes a problem. The source link can also link to a JavaScript file on your computer if targeted that way.
No; because it would make links extremely dangerous.
you can execute javascript from url via events
Ex: www.something.com/home/save?id=12<body onload="alert(1)"></body>
does work if params in url are there.
There is a Chrome extension called Bookmarklet URL (no affiliation). To append a URL with JavaScript, so that the JavaScript command is executed just after loading the webpage, one can use ?bmlet=javascript:
Example: Display an alert box
https://github.com/?bmlet=javascript:alert("Hi");
Example: Enable spell-checking while editing a GitHub README file
[Obviously, a spelling checking extension must be originally available.]
https://github.com/<username>/<repositoryname>/edit/main/README.md?bmlet=javascript:document.getElementById("code-editor").setAttribute("spellcheck","true");
On some pages, it might take some time, as the JavaScript command runs after completely loading the page. Simple commands like alert("Hi"); should run quickly.
I am a student and I have just realized my school blocked JavaScript from the address bar. It works with the "a" tag on a .html file but not on the bar anymore. I am not asking for help, I would just like to share this.
You can do one thing that is you can first open the link www.example.com. Then you can search:
javascript:window.alert("Hello World!")