I wrote this script to pop-up a message any time a user clicks on an external link from our site. When I wrote this I assumed the best way to do this would be to check location.host and compare it to the url the user is attempting to visit.
<script type="text/javascript">
$(function(){
$('a').click(function(){
if (this.href.match(location.host)) {
//alert('Please continue on to our site.');
window.onbeforeunload = null;
}
else {
if (window.confirm('NOTICE: By accessing this link, you will be leaving the DBPR website. DBPR is not responsible for the content of the Internet website you are entering. DBPR neither warrants nor makes any representations nor endorsements as to the accuracy, quality, content or completeness of the information, text, images, graphics, hyperlinks, and other items contained on the Internet website you are entering. DBPR is not responsible or liable for any viruses or contaminations of your hardware, software, peripherals or property, resulting from use of the Internet websites linked to or from the DBPR Internet website. Do you want to proceed?')
){
// They clicked Yes
}
else
{
// They clicked no
return false;
}
}
});
});
</script>
The way the code currently stands, it works in the majority of cases, however I noticed that a couple buttons on our home page reference javascript:void(0), and they cause the confirm box to prompt on click .
Is there a way you would recommend to treat javascript:void(0) as an internal link or completely diregard it?
Thanks,
TG
You could do it like this:
if (this.href.match(location.host) ||
this.href.toLowerCase().indexOf('javascript') !== -1) {
// allow
}
Related
I am looking for a way in JAVASCRIPT (possibly using iframes), to keep the url of an original site when a new page appears. Example: original site url shows www.initialPage.com. When the user clicks ALT-Z, the new website should show the content of www.secondaryPage.com. The code I thought would work looks like below. However, when ALT-Z is selected, www.initialPage.com stays in the url (which is what I want) but only a blank page shows.
document.addEventListener('keydown', function(e) {
if (e.altKey) {
switch (e.code) {
case 'KeyZ':
function prepareFrame() {
var ifrm = document.createElement("iframe");
ifrm.setAttribute("src", "http://www.secondaryPage.com");
ifrm.style.height = "100vh"
ifrm.style.width = "100vw"
document.body.replaceWith(ifrm);
}
prepareFrame();
break;
}
}
});
Is there something I forgot in the function to allow www.secondaryPage.com to display? I know there are security risks but this is for a very small trusted private network
I've done a lot more experimentation on this and it seems the reason the site with the iframe (www.secondaryPage.com) does not display has something to do with the initial page (www.initialPage.com) is a secure site. When I use an un-secure site as the initial page, the secondaryPage is displayed just fine. If anyone can provide some insight as to what I can do to have the above code work while on a secure site, I would appreciate it.
I wrote this script to pop up a confirm dialog when a user clicks on any link external from our site. It performs as expected on our internet site, however when I try to run this script on our FAQ portal, it does absolutely nothing. I believe it is blocking jQuery from running. What would be your recommendation to converting this script to javascript?
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript">
$(function(){
$('a').click(function(){
if ((this.href.toLowerCase().indexOf("myfloridalicense.custhelp") > -1) ||
(this.href.toLowerCase().indexOf("myfloridalicense") > -1) ||
(this.href.toLowerCase().indexOf("javascript") > -1) ||
(this.href.toLowerCase().indexOf("dbprftp") > -1) ||
(this.href.toLowerCase().indexOf("interredesignalpha") > -1) ||
(this.href.toLowerCase().indexOf("bpr") > -1))
{
//Throw away
}
else {
if (window.confirm('NOTICE: By accessing this link, you will be leaving the DBPR website. DBPR is not responsible for the content of the Internet website you are entering. DBPR neither warrants nor makes any representations nor endorsements as to the accuracy, quality, content or completeness of the information, text, images, graphics, hyperlinks, and other items contained on the Internet website you are entering. DBPR is not responsible or liable for any viruses or contaminations of your hardware, software, peripherals or property, resulting from use of the Internet websites linked to or from the DBPR Internet website. Do you want to proceed?'))
{
// They clicked Yes
}
else
{
// They clicked no
return false;
}
}
});
});
</script>
Thanks in advance for your help!
My first guess would be that your portal has a listener attached for all anchor tags to prevent leaving the portal page. More than likely, jQuery is not blocked, the click on the anchor tag is blocked.
You can verify this by binding to the mouseup event on the anchor tags (or one in particular). It's possible that the portal is also cancelling those events, but many people only think to bind to the click.
If you have any control over the page, try adding a click listener to something OTHER than an anchor tag, say a specific div or list item. This will answer whether jQuery is active or not. Once you know the answer to that question, you can decide your next course of action.
function test(){
event.preventDefault();
var path = $('a').prop('href');
if ((path.toLowerCase().indexOf("myfloridalicense.custhelp") > -1) ||
(path.toLowerCase().indexOf("myfloridalicense") > -1) ||
(path.toLowerCase().indexOf("javascript") > -1) ||
(path.toLowerCase().indexOf("dbprftp") > -1) ||
(path.toLowerCase().indexOf("interredesignalpha") > -1) ||
(path.toLowerCase().indexOf("bpr") > -1))
{
//Throw away
}
else {
if (window.confirm('NOTICE: By accessing this link, you will be leaving the DBPR website. DBPR is not responsible for the content of the Internet website you are entering. DBPR neither warrants nor makes any representations nor endorsements as to the accuracy, quality, content or completeness of the information, text, images, graphics, hyperlinks, and other items contained on the Internet website you are entering. DBPR is not responsible or liable for any viruses or contaminations of your hardware, software, peripherals or property, resulting from use of the Internet websites linked to or from the DBPR Internet website. Do you want to proceed?'))
{
// They clicked Yes
}
else
{
// They clicked no
return false;
}
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Link
Same as Keerthi's answer, but uses unobtrusive Javascript:
function test(){
if ((this.href.toLowerCase().indexOf("myfloridalicense.custhelp") > -1) ||
(this.href.toLowerCase().indexOf("myfloridalicense") > -1) ||
(this.href.toLowerCase().indexOf("javascript") > -1) ||
(this.href.toLowerCase().indexOf("dbprftp") > -1) ||
(this.href.toLowerCase().indexOf("interredesignalpha") > -1) ||
(this.href.toLowerCase().indexOf("bpr") > -1))
{
//Throw away
}
else {
if (window.confirm('NOTICE: By accessing this link, you will be leaving the DBPR website. DBPR is not responsible for the content of the Internet website you are entering. DBPR neither warrants nor makes any representations nor endorsements as to the accuracy, quality, content or completeness of the information, text, images, graphics, hyperlinks, and other items contained on the Internet website you are entering. DBPR is not responsible or liable for any viruses or contaminations of your hardware, software, peripherals or property, resulting from use of the Internet websites linked to or from the DBPR Internet website. Do you want to proceed?'))
{
// They clicked Yes
}
else
{
// They clicked no
return false;
}
}
}
document.getElementById('mySuperImportantLink').addEventListener('click', test, false);
HTML:
Link
See this SO question for more details on unobtrusive Javascript.
I just want, when a user comes to my site and closes the window, then I want to know the reason for leaving from my site.
So I'm sending the user to a survey page, using the following script.
It works in every browser but not in Chrome
<script type="text/javascript">
window.onbeforeunload = confirmExit;
function confirmExit() {
if (location.href.indexOf("index.php") != -1)
{
location.href = "http://www.test.com/survey.php";
return "Press 'cancel to go 'survey'";
}
}
</script>
Have you tried to use window.location = ("http://www.test.com/survey.php"); or window.open ("http://www.test.com/survey.php"); instead? That may be easier to do.
You can also do window.open ("http://www.test.com/survey.php", '_newtab'); This will make users less upset off when they are forced to redirect after leaving, because it will be in a new tab.
Well, sometimes there is a good reason for such a code user310850 is quoting
not all websites are in Web, some of them are internal corporate websites
Some if not most of big companies still use IE 6 as standard browser
I would use unload event handler. I assume jquery is good
$(window).unload(function() {
//your code here
});
JavaScript doesn't allow you to update window.location without triggering a reload. While I agree with this policy in principle (it shouldn't be possible to visit my website and have JavaScript change the location bar to read www.yourbankingsite.com,) I believe that it should be possible to change www.foo.org/index to www.foo.org/help.
The only reason I care about this is for bookmarking. I'm working on a photo browser, and when a user is previewing a particular image, I want that image to be the default if they should bookmark that page. For example, if they are viewing foo.org/preview/images0-30 and they click on image #15, that image is expanded to a medium-sized view. If they then bookmark the page, I want the bookmark URL to be foo.org/preview/images0-30/active15.
Any thoughts, or is there a security barrier on this one as well? I can certainly understand the same policy being applied here, but one can dream.
Sounds like you should check out Really Simple History. It's how Google (for example, Gmail) allows any page to be bookmarkable (and has history) but doesn't refresh the whole page.
As for the other side of things (having people visit your site then automatically popping up the correct image), I'd try checking window.location.hash once the page loads and firing events based on that.
You can add an anchor to the URL without reloading the page and pick that up with javascript:
location.href = '.../#' + imageId;
As mentioned, generally with ajaxy sites, you manipulate/check the hash part of the URL (window.location.hash) to determine this kind of activity.
The biggest issue is making sure to check against the hash in DOM-ready/window-load, as if the user clicked on a given image. This will work with browsers and bookmarks, but may hamper search indexing.
How about detecting on page load if the URL contains a hash, and if it does, directing them to the page you want them to go to?
You can add [Add to Favorites] button on the page.
Sample:
var urlAddress = "http://www.example.com/#image1";
var pageName = "Example Page Title - Image1";
function addToFavorites() {
if (window.external) {
window.external.AddFavorite(urlAddress, pageName);
} else {
alert("Sorry! Your browser doesn't support this function.");
}
}
Or use one of these jQuery plugins:
http://plugins.jquery.com/project/bookmark
http://plugins.jquery.com/project/jqbookmark
http://plugins.jquery.com/project/AddFavourite
http://plugins.jquery.com/project/jFav
http://plugins.jquery.com/project/jBookmarkEngine
AND / OR
Use URLs with hash at the end and load your content (images etc.) based on that hash value.
function onLoad() {
if (window.location.hash == "image1") {
// load image1
}
}
There are also lots for jQuery plugins for working with URL hash events, for example:
http://plugins.jquery.com/project/hashhistory
http://plugins.jquery.com/project/hashchange
There are also lots of non jQuery JavaScript libraries for that, for example:
http://code.google.com/p/reallysimplehistory/
<html>
<head>
<script type="text/javascript">
function myHref(){
document.getElementById('myAnchor').innerHTML="Visit Google"
document.getElementById('myAnchor').href="http://www.google.com"
}
</script>
</head>
<body>
<a id="myAnchor" href="http://www.java2s.com">Visit Java2s</a>
<form>
<input type="button" onclick="myHref()" value="Change URL and text">
</form>
</body>
</html>
I'm using the following JavaScript code:
<script language="JavaScript1.2" type="text/javascript">
function CreateBookmarkLink(title, url) {
if (window.sidebar) {
window.sidebar.addPanel(title, url,"");
} else if( window.external ) {
window.external.AddFavorite( url, title); }
else if(window.opera && window.print) {
return true; }
}
</script>
This will create a bookmark for Firefox and IE. But the link for Firefox will show up in the sidepanel of the browser, instead of being displayed in the main screen. I personally find this very annoying and am looking for a better solution. It is of course possible to edit the bookmark manually to have it not show up in the side panel, but that requires extra steps. I just want to be able to have people bookmark a page (that has a lot of GET information in the URL which is used to build a certain scheme) the easy way.
I'm afraid that it might not be possible to have Firefox present the page in the main screen at all (as Googling this subject resulted in practically nothing worth using), but I might have missed something. If anyone has an idea if this is possible, or if there's a workaround, I'd love to hear about it.
For Firefox no need to set any JavaScript for the bookmark an page by script, only an anchor tag with title and rel="sidebar" can do this functionality
Bookmark This Page
I have tested it on FF9 and its working fine.
When you click on the link, Firefox will open an dialog box New Bookmark and if you wish to not load this bookmark on side bar then un-check Load this bookmark in the sidebar from dialog box.
I think that's the only solution for Firefox... I have a better function for that action, it works even for Opera and shows a message for other "unsupported" browsers.
<script type="text/javascript">
function addBookmark(url,name){
if(window.sidebar && window.sidebar.addPanel) {
window.sidebar.addPanel(name,url,''); //obsolete from FF 23.
} else if(window.opera && window.print) {
var e=document.createElement('a');
e.setAttribute('href',url);
e.setAttribute('title',name);
e.setAttribute('rel','sidebar');
e.click();
} else if(window.external) {
try {
window.external.AddFavorite(url,name);
}
catch(e){}
}
else
alert("To add our website to your bookmarks use CTRL+D on Windows and Linux and Command+D on the Mac.");
}
</script>
You have a special case for
if (window.sidebar)
and then a branch for 'else' - wouldn't firefox land in the first branch and hence only add the panel?
Hojou,
It seems that is the only way to add a bookmark for Firefox. So FF needs to land in the first branch to have anything happening at all. I Googled some more but I'm really getting the idea this is impossible to properly address in FF...