Safari ignores the a href link. Other browsers pass the countClicks function AND pass the link to open the new browser window. Any suggestions?
The JavaScript source is as follows:
<script language="JavaScript" type="text/JavaScript">
function countClicks(enterprise_code,sid_code,buspart_id,prod_id,server_name,path_info,query_string)
{
window.location.href = "/sharedInc/cf/polTrack.cfm?Buspart_id=" + buspart_id + "&Enterprise_Code=" + enterprise_code + "&Sid_Code=" + sid_code + "&Prod_id=" + prod_id + "&Server_Name=" + server_name + "&Path_Info=" + path_info + "&Query_String=" + query_string;
}
</script>
Whereas the HTML markup is:
Link
Try with either document.location.href or just location.href .
Hey there. Your code should work. Well i tried this simple example on Safari browser and it works good. Try yourself.
<html>
<head>
<script language="JavaScript" type="text/JavaScript">
function countClicks()
{
window.location.href = "http://www.stackoverflow.com";
}
</script>
</head>
<body onLoad=countClicks()>
</body>
</html>
Anchor Property : FYI : I have used window.open
<html>
<head>
<script language="JavaScript" type="text/JavaScript">
function countClicks()
{
window.open("http://stackoverflow.com", "_blank");
}
</script>
</head>
<body>
Visit StackOverflow Website
</body>
</html>
Passing variables from function
<html>
<head>
<script language="JavaScript" type="text/JavaScript">
function countClicks(a,b)
{
window.open("http://stackoverflow.com?id="+a+"&id2="+b, "_blank");
}
</script>
</head>
<body>
test
</body>
</html>
Remove the url from href and pass the url to the function which you are calling on onclick.
Inside this function, you can simply use window.open(your_url) to open the link in new tab.
So, this will solve your problem.
Here is the sample :
<script language="JavaScript" type="text/JavaScript">
function countClicks(enterprise_code,sid_code,buspart_id,prod_id,server_name,path_info,query_string,new_site_url)
{
window.open(new_site_url);
window.location.href = "/sharedInc/cf/polTrack.cfm?Buspart_id=" + buspart_id + "&Enterprise_Code=" + enterprise_code + "&Sid_Code=" + sid_code + "&Prod_id=" + prod_id + "&Server_Name=" + server_name + "&Path_Info=" + path_info + "&Query_String=" + query_string;
}
and here is your anchor tag :
< a href="javascript:void(0)" onclick="countClicks('POL','POL',6808,387,'www.princetonol.com','/index.cfm','x=x&at=no','http://www.polclients.com')">Link< /a>
So, this code will open a new tab (with the url you provide)
and after opening the tab, window.location will work as usual.
Hope, this will help you.
Related
I´m new on this and I´m having a hard time tryng to do something I think must be simple.
I have a lot of pages hosted on https://www.something.com/path/NUMBER/path/path
Inside those pages I have a button that links to https://www.example.com/path/REPLACE/path
I would like to change REPLACE on my link with NUMBER on the address bar.
This is my code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
<script>
$(document).ready(function(){
var newURL = window.location.protocol + "://" + window.location.host + "/" + window.location.pathname;
pathArray = window.location.pathname.split( '/' );
var part_2 = pathArray[2];
var mylink = "https://www.example.com/path/" + part_2 + "/path/page.html";
});
</script>
<p>BUTTON</p>
</body>
</html>
Thank you very much for your help!
try this.
Url1:- https://www.something.com/path/NUMBER/path/path;
Url2:- https://www.example.com/path/REPLACE/path;
url2 = url2.split('/').map(a => {
if(a == 'REPLACE')
return 'NUMBER';
else
return a;
}).join('/');
If you want to change using Javascript, you can do as below:
var url = "https://www.something.com/path/NUMBER/path/path";
var oldUrl = "https://www.example.com/path/REPLACE/path/path";
var regex = /https:\/\/www\.something\.com\/path\/(\w*?)\/.*/g;
var match = regex.exec(url);
oldUrl = oldUrl.replace("/REPLACE/", "/"+match[1]+"/");
console.log(oldUrl);
-- EDIT --
Another example to replace using browser URL and replace the second path without considering the remaining URL or paths .
$(document).ready(function() {
var url = window.location.href;
// As the script executed in iframe, assigning with hardcode value
url = "https://stackoverflow.com/questions/51442637/change-part-of-link-with-part-of-current-url#";
var oldUrl = "https://www.example.com/path/REPLACE/path/path";
var regex = /https:\/\/\w*?\.?\w*?\.\w*?\/\w*?\/(\w*?)\/.*/g;
var match = regex.exec(url);
oldUrl = oldUrl.replace("/REPLACE/", "/" + match[1] + "/");
document.getElementById("mylink").href = oldUrl;
});
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
<p>BUTTON</p>
</body>
</html>
EDIT:
I think i have found a solution for this one. Might be a little primitive but inserting it here until someone comes up with a better solution.
Thanks !
<html>
<body onload="makeShort()">
<p id="button" style=display:none; onclick="makeShort()">Click me.</p>
<span id="output" style=display:none; >Wait. Loading....</span>
</body>
<head>
</head>
<script type="text/javascript">
function makeShort()
{
var longUrl=location.href;;
var request = gapi.client.urlshortener.url.insert({
'resource': {
'longUrl': longUrl
}
});
request.execute(function(response)
{
if(response.id != null)
{
str =""+response.id+"";
document.getElementById("output").innerHTML = str;
}
else
{
alert("error: creating short url n"+ response.error);
}
});
}
window.onload = makeShort;
function load()
{
//Get your own Browser API Key from https://code.google.com/apis/console/
gapi.client.setApiKey('xxxxxx');
gapi.client.load('urlshortener', 'v1',function(){document.getElementById("output").innerHTML="";});
}
window.onload = load;
</script>
<script>
setTimeout(function(){
document.getElementById('button').click();
},1000);
</script>
<script src="https://apis.google.com/js/client.js"> </script>
</html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<script>
function SendLinkByMail(href) {
var subject= "Interesting Information";
var body = document.getElementById("output").innerHTML;
body += " Interesting Information";
var uri = "mailto:?subject=";
uri += encodeURIComponent(subject);
uri += "&body=";
uri += encodeURIComponent(body);
window.open(uri);
}
</script>
</head>
<body>
<p>Email link to this page</p>
</body>
</html>
Can some one suggest why this "auto-click" function is not working in my code below?
function makeShort() {
var longUrl = location.href;;
var request = gapi.client.urlshortener.url.insert({
'resource': {
'longUrl': longUrl
}
});
request.execute(function(response) {
if (response.id != null) {
str = "<b>Long URL:</b>" + longUrl + "<br>";
str += "<b>Short URL:</b> <a href='" + response.id + "'>" + response.id + "</a><br>";
document.getElementById("output").innerHTML = str;
} else {
alert("error: creating short url n" + response.error);
}
});} window.onload = function() {
var button = document.getElementById('modal');
button.form.submit();}
function load() {
//Get your own Browser API Key from https://code.google.com/apis/console/
gapi.client.setApiKey('xxxxxxxxx');
gapi.client.load('urlshortener', 'v1', function() {
document.getElementById("output").innerHTML = "";
});} window.onload = load;
<html>
<input type="button" id="modal" value="Create Short" onclick="makeShort();" /> <br/> <br/>
<div id="output">Wait. Loading....</div>
<head>
</head>
<script src="https://apis.google.com/js/client.js"> </script>
</html>
My basic aim is to insert a "share via email" button on the page which would shorten the url on the address bar and open user's email client/whatsapp app to share that url..
Obviously I could not find a way to combine these two functions in to one since I am not a very experienced js person. The primitive solution I found is to auto-click the first function, get the short url, and then find a different code to insert this in to the body of the "mailto" link, which will be my 2nd challenge.
To programmatically click a button on page load
If you are using jQuery:
$(function() {
$('#modal').click();
});
Plain javascript:
window.onload = function(){
var event = document.createEvent('Event');
event.initEvent('input', true, true);
document.getElementById("modal").dispatchEvent(event);
};
In IE on Windows 10 with default settings, if I perform a window.open() against an external internet site from a page on my local machine or a server on my local network, I get null.
See my repro below. This doesn't happen in IE on Windows 7 or Google Chrome.
Interestingly, if I turn on "Enable Protected Mode" for the Intranet Zone (so that Protected Mode are the same in the Intranet Zone and Internet Zone), then the problem goes away. However, I need this to work without requiring users to do this.
I haven't found any clear Microsoft documentation that explains this behavior. I raised an issue on this on the EdgeHTML issues site, but wanted to see if the community on SO has any insight into why this is happening.
Thanks!
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<script>
var popupWindow = null;
function openWindow() {
popupWindow = window.open('http://microsoft.com', '_blank', 'left=100;top=100;height=100;width=100');
}
function checkWindowStatus() {
if (popupWindow) {
document.getElementById('status').innerHTML += '- Truthy reference. Closed? ' + popupWindow.closed + '</br>';
} else {
document.getElementById('status').innerHTML += '- Falsy reference: ' + popupWindow + '</br>';
}
}
</script>
</head>
<body>
<h2>Popup Issue</h2>
<button onclick="openWindow()">Open Window</button>
<button onclick="checkWindowStatus()">Check Window Status</button>
<button onclick="popupWindow.close()">Close Window</button>
<p id="status"></p>
</body>
</html>
It seems that protected mode doesn't allow to open new window outside of the current domain, so you can try to open the window with a blank page and after update the location.
<script>
var popupWindow = null;
function openWindow() {
popupWindow = window.open('', '_blank', 'left=100;top=100;height=100;width=100');
popupWindow.location = 'http://microsoft.com';
}
function checkWindowStatus() {
if (popupWindow) {
document.getElementById('status').innerHTML += '- Truthy reference. Closed? ' + popupWindow.closed + '</br>';
} else {
document.getElementById('status').innerHTML += '- Falsy reference: ' + popupWindow + '</br>';
}
}
</script>
I have a page containing a set of hyperlinks. Clicking on any of the hyperlinks should take the user to a new page with the url sent as POST data.
What I am able to do:
1. Open the new page.
What issues I am facing:
1. In the new page, I am trying to access the url that was sent across as data. The url is not visible. Where am I going wrong?
The code I have so far:
<html>
<head>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
function takeMeHome(obj) {
var URL = obj.getAttribute("href");
//alert("Url = " + URL + " with id = " + obj.id);
console.log("URL = " + URL);
$.ajax({
type: 'POST',
url: './bbCloud.php',
data: {'tgt_url': URL},
success:function(data) {
console.log("Function invoked. It seems posting data was a success");
window.location = URL;
//alert('This was sent back: ' + data);
}
});
return false;
}
</script>
</head>
<body>
<p>
Choose one of the links below to access content:</p>
<p>1. Email Etiquette</p>
</body>
</html>
bbCloud.php:
<?php
//the function below displays data from bbMainPage javascript.
function getDataFromLibrary() {
$tgt_url = $_POST["tgt_url"];
echo "Data received = " . $tgt_url . "<br/>";
return $tgt_url;
}
?>
<html>
<head>
<style>
.hlight{background-color:#ffcc00;}
textarea {
width:100%;
height:100%;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="http://myDomain/tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
//mention all global variables here.
console.log("this is the start of javascript");
//get all data from the previous script.
var tgtURL = "<?php getDataFromLibrary(); ?>";
console.log("URl obtained = " + tgtURL);
</script>
<body>
<div>
<audio id="playText" src="" controls></audio>
</div>
</body>
</html>
try dynamically creating and submiting a form instead of trying to ajax it:
<script type="text/javascript">
function takeMeHome(obj) {
var URL = obj.getAttribute("href");
$('<form>', {
"html": '<input type="text" name="tgt_url" value="' + URL + '" />',
"action": URL
}).appendTo(document.body).submit();
}
</script>
Hmm, if I recall correctly, what is happening is that your $.ajax does indeed send the POST data to your php file. The problem is, that it sends the post data, the php file is executed, and a response is sent back, but its sent back to the $.ajax call itself. You THEN redirect to the php file (and thus run it again), but without the post data coming along. Also, something along the lines of $.('a').click(function(event) { event.preventDefault(); } might be a good idea. I'll try and make a better answer for you when I get home (currently on my phone, shouldn't be long).
I am trying to get this particular piece of code working.
It works fine in the developer console, but fails when try it on my computer in a html file. It gives me a error in the pop up which says [object Object]. Could really use some help here. I don't know why is code entering into the error handler while it works fine in the developer console of LinkedIn.
Thanks!
<html>
<head>
<script type="text/javascript" src="http://platform.linkedin.com/in.js">
api_key: my_actual_key
authorize: false
credentials_cookie: true
credentials_cookie_crc: true
onLoad: onLinkedInLoad
</script>
</head>
<body>
<p>This example demonstrates the use of a login button to control what's displayed. It also demonstrates how to use the LinkedIn auth events in a user flow.</p>
<div id="loginbadge">
<p>Login badge renders here if the current user is authorized.</p>
</div>
<!-- NOTE: be sure to set onLoad: onLinkedInLoad -->
<script type="text/javascript">
function onLinkedInLoad() {
IN.Event.on(IN, "auth", function() {onLinkedInLogin();});
IN.Event.on(IN, "logout", function() {onLinkedInLogout();});
}
function onLinkedInLogout() {
setLoginBadge(false);
}
function onLinkedInLogin() {
// we pass field selectors as a single parameter (array of strings)
IN.API.Connections("me")
.fields(["id", "firstName", "lastName", "pictureUrl", "publicProfileUrl"])
.result(function(result) {
setLoginBadge(result.values[0]);
})
.error(function(err) {
alert(err);
});
}
function setLoginBadge(profile) {
if (!profile) {
profHTML = "<p>You are not logged in</p>";
}
else {
var pictureUrl = profile.pictureUrl || "http://static02.linkedin.com/scds/common/u/img/icon/icon_no_photo_80x80.png";
profHTML = "<p><a href=\"" + profile.publicProfileUrl + "\">";
profHTML = profHTML + "<img align=\"baseline\" src=\"" + pictureUrl + "\"></a>";
profHTML = profHTML + " Welcome <a href=\"" + profile.publicProfileUrl + "\">";
profHTML = profHTML + profile.firstName + " " + profile.lastName + "</a>! logout</p>";
}
document.getElementById("loginbadge").innerHTML = profHTML;
}
</script>
<!-- need to be logged in to use; if not, offer a login button -->
<script type="IN/Login"></script>
</body>
</html>
Try replacing
IN.API.Connections("me")
with
IN.API.Profile("me")