Question

我对bootstrap很新，并且对于寻呼机选项来说是全新的。我有一个页面，可以在javascript中使用带有点击事件的引导按钮。我试图用寻呼机选项实现这一点。以下是其中一个选项以及我想要javascript的简单示例。我似乎无法让它做任何事情，如果我添加按钮类，对齐完全去锅！感谢

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>

和点击任一按钮时我想运行的javavscript是： -

$(document).ready(function() {
   $('#next').on('click', function() {
      $('#box1').hide(); 
      $('#box2').show();
   })
});

Answer 1

您将点击处理程序添加到ID为next的元素，但在您的html中，next是一个类名。

将您的js更改为 -

$(document).ready(function() {
   $('.next').on('click', function() {
      $('#box1').hide(); 
      $('#box2').show();
   })
});

Answer 2

试试这个;

<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();
    }); });

bootstrap pager onclick事件

2 个答案: