I want to create a custom hyperlink which passes current URL as one of the parameter to web app endpoint (abc.azurewebsites.net).
These are the versions I tried with thought process of getting the element by Id and update the href using basic HTML properties but no luck.
Approach 1
> <script> baseurl="abc.azurewebsites.net?="
function buildURL(item) {
> item.href=baseurl+window.location.href;
> return true; }
</script>
> </head> <body> <a onclick="return buildURL(this)" href="">Google</a> </body>
Approach 2
Click on this <a href=""
target="_self" id= "test" onclick = buildURL() >Link </a> to execute
<script>
var el_up = document.getElementById("test");
function buildURL() {
this.href = "abc.azurewebsites.net?=" + document.URL;
}
</script>
Any suggestions please. Is it even possible?
Update: Just to mention, I'm trying this from Azure Devops description section
I believe this will work:
<body>
<a id="link-to-edit" href=""> Click here to execute </a>
</body>
<script>
baseurl="https://abc.azurewebsites.net?="
link = document.getElementById("link-to-edit")
link.href = baseurl + window.location
</script>
This will use javascript to programmatically update the href to the baseurl plus current location as soon as the page/script loads. Then when you click the link will be executed properly. The key is that the href must be set at the time of clicking. In your examples, you set the href AFTER the user clicks and thus the link will not work as you intend. Hope that helps!
Related
I'm my backend part of the app which is built in PHP Symfony I have HTML twig files, I want to change behavior for some href link, I want to hide URL in the bottom left corner after I hover them, I tried this solution that needs to change URL text to Contact, but it won't work
<a
class="activo"
href="link"
onmouseover="window.status='Contact'"
onmouseout="window.status=''"
>
Click
</a>
any help?
TL;DR; Simply use JavaScript, like:
window.location.href = "https://stackoverflow.com";
Remove the "<a ...>" element's href-attribute.
Then make it trigger a JavaScript function:
<a onclick="myFunction()">my link</a>
Finally, simply use JavaScript to redirect, like:
<script type="text/javascript">
function myFunction() {
window.location.href = "https://stackoverflow.com";
}
</script>
Note that you may need to add CSS to set cursor, I mean, already existing CSS may check href's existence, and not apply once href is removed.
Reusing same function
<a data-url="https://stackoverflow.com"
onclick="myFunction(this)">my link label</a>
<!-- In case you are using Twig or Blade: -->
<a data-url="{{ 'https://example.com' }}"
onclick="myFunction(this)">my other link</a>
<script type="text/javascript">
function myFunction(element) {
window.location.href = element.getAttribute('data-url');
}
</script>
I'm trying to open a URL in new window and want to share the current page address using inline function as below:
a href="javascript:void(0);" onClick='(function()
{
var link = string.concat("example.com/UserStatus.phpid=99244613&utm_source=",window.location.href);
console.log(link);
});return false;'>click here</a>
But nothing is happening, please help.
The problem was that you were using string.concat but the right way to use is "".concat:
function fun(){
var link = "".concat("example.com/UserStatus.phpid=99244613&utm_source=", window.location.href);
console.log(link);
}
fun();
Output will be:
example.com/UserStatus.phpid=99244613&utm_source=https://playcode.io/
HTML:
<a href="javascript:void(0);" onClick='fun();'>click here
</a>
So in your code just use "".concat instead of string.concat.
This works fine.
<a href="javascript:void(0);" onClick="(function(){
var link = ''.concat(`example.com/UserStatus.phpid=99244613&utm_source=`,window.location.href); console.log(link);
return false;
})();return false;">click here
</a>
Working Codepen Link
I tried to fix hard code(web link in href) in the following line:
'<a class="top_a" target="_blank" href="http://10.74.55.99:3000/"><img src="images/load.svg"><img src="images/nbsp.png">LoadServer</a>'
modified to：
<script type="text/javascript">
function openLoadserver() {
window.location.href = load_server; //defined load_server in other file
}
</script>
'<a class="top_a" target="_blank" href="#" onclick="openLoadserver()"><img src="images/load.svg"><img src="images/nbsp.png">LoadServer</a>'
The result is, after I click "LoadServer", current page will open the load server page, and a new tab page open the "current page" again.
My expected result is current page is keeping as original, new tab page will open the load server.
What should I do?
<a class="top_a" onclick="openLoadserver()"><img src="images/load.svg"><img src="images/nbsp.png">LoadServer</a>
Notice the difference, the target attribute :) You don't need href either
I tried using a href=javascript:function() in a button, with a function to execute it. It works in Chrome but it doesn't work in Firefox.
Firefox doesn't alert and open blank tab.
Anyone can help me?
<script>
function verifyisbot() {
alert("test.");
var win = window.open("http://yahoo.com", '_blank');
win.focus();
}
</script>
Below is button code
<div class="frb_textcenter">
<a target="_blank" class="frb_button frb_round frb_center frb_fullwidth" href="Javascript:verifyisbot();">
click here
</a>
</div>
Update
I should have added that im using a live editor(profitbuilder) in wordpress to generate the page and button. There is no area for me to insert additional javascript onclick function to the button. So i figure out to use "ahref" blank field in the live editor to input javascript call function to fire up the function.
Is there any way i can make this work through the ahref without using onclick event? Or can i specify onclick function in the ahref field?
Sorry the test() is actually verifybot() function, typo mistake
You can achieve the goal using only the href attribute:
<a href="javascript:void(verifyisbot())" class="frb_button frb_round frb_center frb_fullwidth">
click here
</a>
It works, because when a browser follows a javascript: URI, it evaluates the code in the URI and then replaces the contents of the page with the returned value, unless the returned value is undefined. The void operator can be used to return undefined.
Use onclick event instead of a href=javascript.It works on firefox.See below:
<div class="frb_textcenter">
<a target="_blank" class="frb_button frb_round frb_center frb_fullwidth" onclick="test()">click here</a></div>
<script>
function test() {
alert("test.");
var win = window.open("http://yahoo.com", '_blank');
win.focus();
}
</script>
UPDATE 1: You can do it without use javascript.You just add the link in the href attribute.See below:
<a target="_blank" class="frb_button frb_round frb_center frb_fullwidth" href="http://yahoo.com">click here</a></div>
Give serious consideration to separating your JavaScript and your HTML such that the problem goes away. For instance, add an ID to your anchor and add an event handler through script:
<div class="frb_textcenter">
<a id="verify" target="_blank" class="frb_button frb_round frb_center frb_fullwidth" href="http://yahoo.com">
click here
</a>
</div>
Later...
<script>
function test() {
alert("test.");
var win = window.open("http://yahoo.com", '_blank');
win.focus();
}
window.onload = function () {
document.getElementById('verify').addEventListener('click', test);
};
</script>
Do note that with the example provided, you don't actually need JavaScript at all. The HTML itself will cause a new window/tab to open with Yahoo! loaded...
I am using a javascript function to navigate away from my website and to another website. I am also trying to open a new page when the button is clicked but instead it navigates on self instead of blank. Why does this happen?
HTML
<p style="text-align:center;">
<input style="font-size:large;" id="btamen" type="button" value="Visit Website">
</p>
JavaScript
<script type="text/javascript">
$("#btamen").click(function() {
window.location.href = 'http://www.google.com'
link.target = '_blank';
});
</script>
This line: window.location.href = 'http://www.google.com' will always replace current page with the new url.
I don't know what is link in the next page, but that code won't even execute because the page redirects and the context is lost.
If you want it like that, then do this:
window.open('http://www.google.com', '_blank').focus();
Also, you cannot guarantee its opening as browser might block it. Sort of kinda pop up blocker.
I don't think you can control it to open in a new tab. So you have to work around, what I did is:
<a href="" target="_blank" id="btamen_link">
<button type="button" id="btamen">
Click
</button>
</a>
And the jquery:
<script type="text/javascript">
$(document).ready(function(){
$('#btamen').click(function(){
$('#btamen_link').attr('href', 'http://www.google.com');
$('#btamen_link').click();
});
});
</script>