jQuery click event not working in a jQuery tab page
I'm using a jQuery tab in my MVC3 solution. The problem is that when I insert a link in one of these tabs, I'm not able to control this link with jQuery?!
Here is my code:
The main tab subdivision page:
<div id="tabContainer">
<ul>
<li>@Html.ActionLink("Tab 1", "DetailFooterTab1", "MyController")</li>
<li>@Html.ActionLink("Tab 2", "DetailFooterTab2", "MyController")&l开发者_StackOverflow社区t;/li>
<li>@Html.ActionLink("Tab 3", "DetailFooterTab3", "MyController")</li>
</ul>
with this script:
$("#tabContainer").tabs();
In my Tab3 page I have this code:
<a href="#" id="buttonTest">Test</a>
<script type="text/jscript">
$("#buttonTest").click(function () {
alert('I am a link in the Tab 3 page');
});
</script>
These jQuery tabs works. I mean I can click on one of these and the system is showing the corresponding tab (and hiding other tab content). BUT When I click the test link, nothing happened! Any idea?
did you put your code on $(document).ready ?
$(document).ready(function(){
$("#buttonTest").click(function () {
alert('I am a link in the Tab 3 page');
});
});
or if that element added on dom later. you can use live event like
$("#buttonTeest").live('click',funciton(){
alert('I am a link in the Tab 3 page');
});
Try this,
$("#buttonTest").click(function (e) {
e.preventDefault();
alert('I am a link in the Tab 3 page');
});
If you are adding them at runtime use live instead of bind
$('#buttonTest').live('click', function() {
e.preventDefault();
alert('I am a link in the Tab 3 page');
});
精彩评论