Handling URLs (Hyperlinks) using jQuery
Introduction
Source Article: Here
Assume
I have a blog/website and I want all external URLs to open on new browser tab.
For example when you click on any external URL on Facebook, it opens URL on new
tag. No meaning you have mentioned "target" attribute with URL or
not, I always want external URLs to open on new tab.
In
addition with this, I also want to add an external icon with all external URLs.
How to do this?
Let's read all one by one.
If you simply want to open all URLs on new tab, a quick
jQuery code can do this. Here you go.
jQuery
Code
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('div.MyURLs a').attr({ target: '_blank' });
});
</script>
Using above jQuery, just adding a new attribute 'target'
to '_blank' to all URLs inside <div class="MyURLs">.
ASPX
Code
<body>
<div class="MyURLs">
<a href="http://www.itorian.com">ITORIAN</a>
<br />
<a href="http://www.google.co.in">Google</a>
<br />
<a href="http://www.yahoo.in">Yahoo</a>
<br />
<a href="http://www.microsoft.com">Microsoft</a>
<br />
<a href="http://www.c-sharpcorner.com">C# Corner</a>
</div>
</body>
Very simple code above, I'm using five URLs having no
any target attribute and my jQuery code will add this to DOM.
Adding
Icons to external URLs
Comments
Post a Comment