[英]bootstrap pager onclick event
I have pretty new to bootstrap and totally new to the pager option. 我对引导程序很陌生,对寻呼机选项也很陌生。 I have a page that works with bootstrap buttons with click events in javascript.
我有一个页面,可处理带有javascript中单击事件的引导程序按钮。 I am trying to implement this with the pager option.
我正在尝试使用传呼机选项来实现。 Below is just a quick example of one of the options and what I want the javascript to do.
以下只是其中一个选项以及我希望javascript执行的操作的快速示例。 I cant seem to make it do anything and if I add button class to it, the align totally goes to pot!
我似乎无法使它执行任何操作,如果我向其中添加按钮类,则对齐完全可以进行! Thanks
谢谢
The html is : 的HTML是:
<div class="col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2 col-xs-10 col-xs-offset-1">
<ul class="pager">
<li class="previous"><a href="#">Back</a></li>
<li class="next"><a href="#">Next</a></li>
</ul>
</div>
and the javavscript I would like to run when either of the buttons is clicked is :- 当我单击两个按钮中的任何一个时我想运行的javavscript是:
$(document).ready(function() {
$('#next').on('click', function() {
$('#box1').hide();
$('#box2').show();
})
});
You're adding the click handler to an element with an id of next
, but in your html, next
is a class name. 您要将点击处理程序添加到id为
next
的元素中,但是在您的html中, next
是一个类名。
Change your js to - 将您的js更改为-
$(document).ready(function() {
$('.next').on('click', function() {
$('#box1').hide();
$('#box2').show();
})
});
Try like this; 这样尝试;
<div class="col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2 col-xs-10 col-
xs-offset-1">
<ul class="pager">
<li id="previous" class="previous"><a href="#">Back</a></li>
<li id="next" class="next"><a href="#">Next</a></li>
</ul>
</div>
$(document).ready(function() {
$('#previous').on('click', function() {
$('#box2').hide();
$('#box1').show();
});
$('#next').on('click', function() {
$('#box1').hide();
$('#box2').show();
}); });
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.