How to open script in new tab - javascript

So when a user interacts with <script>
, I want to make it open in a new tab.
I tried doing this:
<script target="_blank"
but that didn't work. Help please!
EDIT: I'm sorry for not making myself that clear. I meant that when a user clicks on my bidvertiser ads, I want the ads to open on a new page. they are in script form so when the user clicks on the script, I want to open the script in a new page sort of like <a target="_blank>

I dont know if this is exactly what your looking for. But by the way you said the following:
"when a user interacts with script , I want to make it open in a new tab"
I assume you mean when the script is executed "after html page is rendered" you want a new tab to be created, if so then this code will work both inline with your html or in its own script file.
//pure js
document.addEventListener("DOMContentLoaded", function(event) {
window.open('http://www.google.com');
});
// jquery
$(function() {
window.open('http://www.google.com');
});
++++++++
Per your latest reply.
You could setup a click listener for the ads, i'd suggest maybe using a shared css class amongst the ads and in JQuery setup a click listener like such. Maybe using 'Inspect Element' you can find a class name that each ads has and use the code below to listen to the click.
$('.class-name').click(function () {
window.open('http://www.theurlfromad');
});

Related

Intercept button click with jQuery from iframe to other iframe

I'm using wix to create simple landing page and would like to connect it with google analytics events.
I would like to intercept the event of pushing form send button.
Page example with form
The button id -> submitButton
Normally if i have full access to page code i use:
<script type="text/javascript">
$(document).ready(function () {
$('#buttonName').click(function () {
//google function
ga('send', 'event', 'EventCategory', 'EventCategory', 'EventName');
});
});
</script>
But here I can use only iFrame an internal plugin (hat generate code inside iframe).
PAGE STRUCTURE:
- Text, image ecc ecc;
- iFrame with form (managed by plugin, where i can't add/edit code);
- iFrame where i can add code. for example: example page
So I need to invoke click event of the button with id submitButton from an iframe which invokes the click of the button placed in other iframe (where the id is unknown).
is there a way to do that?
Thank you for response.
If you do not have access to the iFrame code you will not be able to put that tracking id the way you want.
If you're trying to intercept a click event within the iframe that you don't have control of, I'm pretty sure that's not possible for security reasons: otherwise it would be possible for an advert or any third party code on your page to intercept events on completely unrelated elements.
If you're trying to pass a click event from a bit you do control to a button that you don't, unless you know the ID of the button in the other iFrame you want to click, I don't think you're going to have much luck.

How do I get Joomla to stop opening every link in a new tab?

I changed a domain name of my website, and now every link opens in new tab (menu, logo, external links etc.) I want to know how to get back to normal behavior when Joomla opens only external links in new window. How can I solve this and what could be the cause of it?
Link to my website: http://sparkle-soft.com
I'm using Joomla 2.5
You have a inline script tag in your head for some sort of specialtrack. There is a line of code within the function that is applying a blank target attribute to all links on your page:
links[i].setAttribute('target', '_blank');
Check to see what tracking you have added to your site, look for any options if provided that would allow you to change this. It could be coming from an extension or your template but hard to tell as it's inline, rather than a source file.

JavaScript Bookmarklet; click button, reload page, then open page

I am trying to create a bookmarklet that follows this process:
From any page, click the bookmarklet
load a specific page.
Trigger an input button which causes page to reload
Once reloaded; open a new page; in this case a social media page.
This is what I've written so far:
if (!($ = window.jQuery)) {
// Inject jQuery to make life easier
script = document.createElement( 'script' );
script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js';
script.onload=SocialCredentials;
document.body.appendChild(script);
}
else {
SocialCredentials();
}
function SocialCredentials(){
$('input:submit').trigger('click');
window.open('http://www.facebook.com', '_blank');
}
The button submit click causes the page to process and clear the credentials of the user so they can visit social sites.
The above code works, but I want to make sure the page finishes loading before opening a new social media page.
Do I need to add some kind of wait() function? If I do add a wait method, will it kill the JavaScript and not open the new window? I'm fairly new to JavaScript, so I'm not familiar with these types of mechanics.
Edit:I should note that I don't have access or control to the page this bookmarklet will work on so I can't alter it's flow. What I'm trying to do is more of a favor for another department as a quick fix until they can make changes on their end.
Edit2: Updated the process.
If a page reloads, any code currently running on that page, including code from a bookmarklet, is ended and removed. Traditionally bookmarklet code ceases to work after a page load and user clicks it again.
There are three workarounds that I know of.
A.) Change the process that loads the page to instead use AJAX.
B.) Change the process that loads the page to instead open a new window, and then use JavaScript to manipulate the new window.
C.) Before triggering the page load, open a new child window and insert code into it. The code in that child window can then monitor its parent and take actions on the parent even after the parent has reloaded.

Redirect to a specified page using JavaScript

Is there any way through which i can have a javascript on a page to redirect any url that's present on the page to some specific site.
For example on a HTML page i have say 10 urls present. Can i add a javascript to the HTML page so that if anyone clicks on any url on that page, it gets redirected to the a specified page.
Thanks.
EDIT::
My scenario is i have some 13k links on a page and i do highlighting of terms on the page, even if any link is also clicked on the page, the word gets highlighted on that page. In order to do that i process each url and add some more info to it to go thought my server perl script which does the job of highlighting. But now due to large number of links on page, it takes time to process the page and page is rendered after a long time. So i want to have a javascript which can pass any link by adding info to my perl script on server.
I tried doing it server side my breaking page into pieces and processing in parallel but not much improvement.
Any other solution or suggestions are welcomed.
Appreciate your help in this regard.
You can use preventDefault in the click event handler to prevent the default behavior(open the link), and use location.href to redirect to a new page.
if you're using jQuery:
$(".links").click(function(event){
event.preventDefault();
location.href = "http://google.com";
});
You can do this with the following jQuery block:
$(document).ready(function () {
$('#urlId').live('click', function (e) {
e.preventDefault(); //Stops the link from opening
window.location.href = "/specifiedPage"; // Changes the location of the page
});
});
You can create a "protective glass" div in front of everything and handle the click event on that div. This has the advantage of not touching the page so after removing the div anything can go back to normal.
Only be sure to put a non-fully-transparent color on the div background because I've found that Internet Explorer ignores events if the div is fully transparent.
Something like rgba(0,0,0,0.001) is enough.

What's the simplest way to get an image to print in a new window when clicked?

I'm trying to create a simple click to print link for an image, and what I'd like to happen is when the link is clicked, a new window opens with the image, and the browser opens the print command dialogue box.
My question is whether this is possible just from a URL parameter, or from the anchor element on the initiating page? Or do I have to build a target page with javascript to do this?
Here's a sample of what I've got:
<p class="click-2-print">
Click here to print the map above
</p>
Obviously the code above will open the image in a new window, but still requires to user to hit Ctrl+P, Cmd+P or use the browser commands. My client wants the image to "just print" when the user clicks the link, so I'm trying to find the simplest way to accomplish this.
So is there any parameters or attributes that I can add to the above markup to accomplish what I have described?
You'll have to call window.print(). Perhaps something like this?
function printimage(){
var URL = "http://myimage.jpg";
var W = window.open(URL);
W.window.print();
}
Another option may be to put the image on a page that tells the browser to print when loaded. For example...
<body onload="window.print();">
<img src="/img/map.jpg">
</body>
Cody Bonney's answer will not work in certain browsers if the full url includes the image extension. The browser will automatically download it as soon as the new tab opens. You can get around this like so.
var url = scope.src;
var w = window.open('', '');
w.document.write('<html><head>');
w.document.write('</head><body >');
w.document.write('<img id="print-image-element" src="'+url+'"/>');
w.document.write('<script>var img = document.getElementById("print-image-element"); img.addEventListener("load",function(){ window.focus(); window.print(); window.document.close(); window.close(); }); </script>');
w.document.write('</body></html>');
w.window.print();
This will open a new page with the image, prompt the user to print, and after printing, close the new tab and reset focus to the original tab.
Disregard the scope.src that is angular specific code. Everything else should work as long as you provide your own url value from somewhere else
I would recommend you create a page in whatever language or framework you are working in that accepts a querystring argument for the image path, output that image in the document and have an onload / ready call to window.print(). Link to that instead of the image directly, and keep the target="_blank" and you should be set.
You have to call window.print() in javascript to trigger the browser print dialog. I'm pretty sure you can't trigger a print without user interaction unless you run a signed applet.
Hey Jag. Although its not exactly what you are looking to do, I did write this tutorial while I was working at a web design firm. You can probably rummage that code to get the link that prints the image. Basically what this code does it add a print button to the fancybox jquery plugin. I dont see why you couldnt just use the print part to add it to whatever you need. Hope it helps.
Add print ability to fancybox jquery plugin

Categories