Stop some links (href containing certain string) from working - javascript

I'm attempting to stop some links on my site from working.
Here is my code:
Links:
<a href='http://mysite.home.com'>Home</a><br>
<a href='http://mysite.home.com/nextpage'>Next Page</a><br>
<a href='http://mysite.string.home.com'>Home 2</a><br>
<a href='http://mysite.string.home.com/otherpage'>Other Page</a>
Jquery:
<script>
$("a[href*='.string.']").click(function(e) {
e.preventDefault();
alert('You cannot use this link');
});
</script>
The goal is to stop the last two links (with href containing '.string.') from working and instead display the alert. However, this code isn't working and the links still work. What am I doing wrong?
The strange thing is the code works fine here: http://jsfiddle.net/TzUN3/364/
but not on my site. I have the script and links both in the <body> of my page, script after the links. Is this correct?
Thanks.

Forgot to add
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
to my page. Feel like an idiot.
Thank you all.

$(function() {
// Jquery is ready
// *= is contains
$("a[href*='.string.']").click(function(e) {
e.preventDefault();
alert('You cannot use this link');
});
});

Related

How to automatically click on a HTML link when opening a new window?

I have a small program in JSP which basically when I click on a document, it opens a new window that allows me to view it. The problem here is it would not show the viewer unless I update or install adobe flash player.
I added a hyperlink link where I can easily click on it and it prompts me to "Allow" to view the document which is fine. The hyperlink looks like below:
<a href="https://get.adobe.com/flashplayer" >Enable Flash</a>
<img border="0" alt="Enable Flash" src="enable_flash.gif"/>
Now, I have to manually click on it, is there a way I can have the hyperlink auto clicked when the pop up windows shows?
I am new to JavaScript and HTML so I figured there is something that I could use like <body onload > .
Edit
This is how my code looks like now:
<body onload="Auto()" > <!--oncontextmenu="return false;"-->
<script>
function Auto(){
<a href="https://get.adobe.com/flashplayer" >Enable Flash</a>
<img border="0" alt="Enable Flash" src="enable_flash.gif"/>
}
</script>
Am I doing anything wrong?
You can simply use click() method
Add id to anchor element
<a href="https://get.adobe.com/flashplayer" id="myLink" >Enable Flash</a>
Add to your script
function automateClick() {
document.getElementById('myLink').click()
}
window.addEventListener("load", automateClick);
Yes..you can use below code and load your link there
$(document).ready(function() {
document.querySelector('a[href="https://get.adobe.com/flashplayer"]').click();
});
OR
$(function() {
document.querySelector('a[href="https://get.adobe.com/flashplayer"]').click();
});
OR
window.onload = function() {
document.querySelector('a[href="https://get.adobe.com/flashplayer"]').click();
}
You can do this with as little as one line, if you want to learn more about the approach I've used, then it may be worth your time looking into functions such as querySelector. Once you have the desired element, you can then simply fire the click method like so.
Demo
<script type="text/javascript">
document.querySelector('a[href="https://get.adobe.com/flashplayer"]').click();
</script>

How to call javascript in href in sharepoint column

I do have a calculated column in sharepoint which creates an anchor tag in which href have a javascript function call to test method but it's not getting called what i am missing here.
Code :
<script type="text/javascript">
function test()
{
alert("hiii");
}
</script>
and calculated column :
<a href='javascript:test()'> Click </a>
Thanks in advance
Pure JS:
function test(){
alert("I am alerted");
}
<a onclick='test()' > Click </a>
jQuery
$(document).ready(function (){
$("#myID").on("click", function (){
alert("I am alerted !");
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="myID" > Click </a>
If I understand, you need to change the display (html generated) of a field in SharePoint.
You are un 2013, you can use JSlink property of your field. With this, you can link a file JS to your field, and this file will be executed every time that sharepoint will generate the rendering of your field.
Check this link to understand how it work and see some exemples ;) : https://code.msdn.microsoft.com/office/Client-side-rendering-JS-2ed3538a
hope this will help you
The attribute in the anchor you are looking for is called onclick:
<a onclick="test()"> Click </a>
This should do the trick I guess.
Check the w3c-schools site for a more detailed description: W3C Schools on the onclick HTML attribute
Please try this way:
<a href='javascript:void(0)' onclick='test()'> Click </a>
<script type="text/javascript">
function test()
{
alert("hiii");
}
</script>

a href=javascript:function() in firefox not working

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...

Wordpress Nav / Menu onClick event solution

Okay, I have a problem:
I have this code that creates a button, but I need that same onClick event in my wordpress menu www.slingerbistro.dk (the top right corner - booking button).
I've read, that it requires to put in some coding in the header.
The booking code I've received is like this:
<!-- DinnerBooking Booking Box Start -->
<script type="text/javascript" src="http://js.i.dinnerbooking.eu/onlinebooking.js"></script>
<a onclick="return openDBWindow(this.href);" href="http://slingerbistro.b.dinnerbooking.com/onlinebooking/997/2" id="wd_booking_btn" title="Se ledig tid og book bord" class="btn_blue"><span>Se ledig tid og book bord</span></a>
<!-- DinnerBooking Booking Box End -->
And what I've done is trying to get that into my header.php in the theme. So far I've come up with this:
<script type="text/javascript" src="http://js.i.dinnerbooking.eu/onlinebooking.js">
jQuery(document).ready(function($) {
$("#menu-item-top-level-10").on("click", function(e){
e.preventDefault();
// dinnerbooking code here
return openDBWindow (this.href == "http://slingerbistro.b.dinnerbooking.com/onlinebooking/997/2")
});
}); </script>
Does anybody have the skills to look at my sorry excuse for a code and correct it? I'm not a programmer (obviously) and could really need your help.
The booking button has "#menu-item-top-level-9" so basically the code I'm trying to write should give the same effect with the drop-down-widget as the sample widget I posted on top.
Thank you <3
Try to replace your code to this:
<script type="text/javascript" src="http://js.i.dinnerbooking.eu/onlinebooking.js">
jQuery(document).ready(function ($) {
$("#menu-item-362").on("click", function (e) {
e.preventDefault();
// dinnerbooking code here
return openDBWindow ($(this).attr('href'));
});
});
</script>
First, there is no element with id: menu-item-top-level-10
Second, you do not want to change the href. You want to read it.

javascript:void(0) in jquery

I have an jsp page with html and js like below. Now I want to keep the js function test() to another js file. I m trying to write that using jquery.
<div class="class1">
<a href="javascript:void(0)" onclick="test();" id="add_another" ><b>Add another user</b></a>
</div>
JS function
function test(){
alert("I am here");
//other code
}
I tried to write like this
$(function() {
$('#add_another').click(test);
});
But its not working. I am not sure if its because its having href="javascript:void(0)"
When the user clicks Add Another User link, it show display another div. That is the test() doing. But the alert itself is not coming.
Can somebody please help me in this?
To replicate javascript:void(0) you can use event.preventDefault() in js like this.
$(function () {
$('#add_another').click(function (e) {
e.preventDefault();
test();
});
});

Categories