how to pop up the alert when click the link
Question
i am newbie with html and jquery. i want to show an alert box when click the link. but seems the jquery function doesn't work. not sure the selector or something else is wrong.
please suggest. thanks.
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>
<body>
<p>text1</p>
<p>text2</p>
<p>text3</p>
<input type=button onClick="location.href='http://www.test.com/?test=123'" value='click here'>
<div class="modify">
<a href="http://www.test.com" id="myHref">test1</a>
<p/>
<a href="http://www.test.com" id="myHref">test2</a>
<p/>
<a href="#" id="myHref1" class="button mini-button blue">test3</a>
</div>
<script type="text/javascript">
function ($) {
alert('test');
}
$self.find("#myHref").each(function () {
$(this).on("click", function () {
var $this = $(this),
alert ($this.attr('href'));
});
});
</script>
<body>
</html>
4 answers
solution1
1 2015-08-06 18:00:23
Here is your updated code
function n($) { alert('test'); } n() $(document).find("#myHref").each(function () { $(this).on("click", function () { var $this = $(this); alert ($this.attr('href')); return false; }); });
<head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> </head> <html> <body> <p>text1</p> <p>text2</p> <p>text3</p> <input type=button onClick="location.href='http://www.test.com/?test=123'" value='click here'> <div class="modify"> <a href="http://www.test.com" id="myHref"> test1 </a> <p/> <a href="http://www.test.com" id="myHref"> test2 </a> <p/> <a href="#" id="myHref1" class="button mini-button blue"> test3 </a> </div> <body>
solution2
0 2015-08-06 18:00:49
$("body").on("click",".modify a", function() {
alert("hi");
});
solution3
0 2015-08-06 18:03:00
Because you're referencing JQuery in your question you can enjoy the magic using the click event directly with your links :
$(function(){ //ready function
$('#myHref').click(function(){ //click event
alert($(this).attr('href'));
});
})
Hope that this what you want.
solution4
0 2015-08-06 18:21:37
you can use onclick in event of href just simple:
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>
<html>
<body>
<p>text1</p>
<p>text2</p>
<p>text3</p>
<input type=button onClick="location.href='http://www.test.com/?test=123'" value='click here'>
<div class="modify">
<p>
<a href="http://www.test.com" id="myHref" onclick="return confirm('Are you sure?')">test1</a>
</p>
<p>
<a href="http://www.test.com" id="myHref" onclick="return confirm('Are you sure?')">test2</a>
</p>
<p>
<a href="http://www.test.com" id="myHref1" class="button mini-button blue" onclick="return confirm('Are you sure?')">test3</a>
</p>
</div>
</body>
</html>
And remember always open and /close tags. eg:
<body>
<div>
<p>
</p>
</div>
</body>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.