The jQuery library provides various options to work with href links, in this post Asp.Net jQuery href Example, we shall see the various attributes and events of the Hyperlink control.
Running the sample
To run the sample at your desk, create a
new Asp.net page; copy the entire code below, change reference of the jQuery files
to point to your local directory. Build and run the application.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Links
(a href)</title>
<link
type="text/css"
href="Stylesheet.css"
rel="Stylesheet" />
<script
type="text/javascript"
src="JavaScript/jquery-1.7.2.js"></script>
<script
type="text/javascript"
language="javascript">
$(document).ready(function()
{
$('#cmdGet').click(function(event) {
event.preventDefault();
alert('H
REF: ' + $('#lnkGoogle').attr('href'));
alert('ID:
' + $('#lnkGoogle').attr('id'));
alert('Attribute
(target): ' + $('#lnkGoogle').attr('target'));
alert('TEXT:
' + $('#lnkGoogle').text());
});
//
$('#cmdSet').click(function(event) {
event.preventDefault();
$('#lnkGoogle').attr('href', 'http://www.gmail.com');
$('#lnkGoogle').text('Gmail');
$('#lnkGoogle').attr('target', '_self');
});
//
$('#lnkGoogle').click(function(event) {
alert("Link
Clicked, redirecting to " + $(this).attr('href'));
});
//
$('#lnkGoogle').hover(function() {
alert("Hover
on Link");
});
//
$('#cmdLoop').click(function(event) {
event.preventDefault();
$('a').each(function() {
alert('Link: ' + $(this).text());
});
});
});
</script>
</script>
</head>
<body>
<form id="frmLinks" runat="server">
<b>Links (a
Href)</b><br
/>
<a id="lnkGoogle"
href="http://www.google.com"
target="_blank">Google</a>
<br />
<a id="lnkYahoo"
href="http://www.yahoo.com">Yahoo</a><br
/>
<a id="lnkFacebook"
href="http://www.facebook.com">Facebook</a><br
/>
<br /><br />
<b>Hyperlinks
(asp:HyperLink)</b><br />
<asp:HyperLink
ID="lnkMicrosoft"
runat="server"
Text="Microsoft"
NavigateUrl="http://www.microsoft.com/">
</asp:HyperLink><br />
<asp:HyperLink
ID="lnkMSDN"
runat="server"
Text="MSDN"
NavigateUrl="http://msdn.microsoft.com/en-US/">
</asp:HyperLink>
<br /><br />
<asp:Button
ID="cmdGet"
runat="server"
Text="Get"
Width="100"/>
<asp:Button
ID="cmdSet"
runat="server"
Text="Set"
Width="100"/>
<asp:Button
ID="cmdLoop"
runat="server"
Text="Loop"
Width="100"/>
</form>
</body>
</body>
</html>
Run the application, Click on the Get, Set & Loop button, observe the events and attributes of the Hyperlink control.
Run the application, Click on the Get, Set & Loop button, observe the events and attributes of the Hyperlink control.
Related Post
Asp.Net jQuery get href link
Asp.Net jQuery get href ID
Asp.Net jQuery get href target Attribute
Asp.Net jQuery get Link Text
Asp.Net jQuery set href URL
Asp.Net jQuery set href Text
Asp.Net jQuery set href Target Attribute
Asp.Net jQuery href click Event Handler
Asp.Net jQuery href mouse hover Event Handler
Asp.Net jQuery loop through all href controls in a Page
Asp.Net jQuery href Example
Asp.Net jQuery get href link
Asp.Net jQuery get href ID
Asp.Net jQuery get href target Attribute
Asp.Net jQuery get Link Text
Asp.Net jQuery set href URL
Asp.Net jQuery set href Text
Asp.Net jQuery set href Target Attribute
Asp.Net jQuery href click Event Handler
Asp.Net jQuery href mouse hover Event Handler
Asp.Net jQuery loop through all href controls in a Page
Asp.Net jQuery href Example
No comments:
Post a Comment