Question

这是我的代码：

$(document).ready(function(){
$('#next').click(function() {
    $('.current').removeClass('current').hide()
        .next().show().addClass('current');
    if ($('.current').hasClass('last')) {
        $('#next').attr('disabled', true);
    }
    $('#prev').attr('disabled', null);
});

$('#prev').click(function() {
    $('.current').removeClass('current').hide()
        .prev().show().addClass('current');
    if ($('.current').hasClass('first')) {
        $('#prev').attr('disabled', true);
    }
    $('#next').attr('disabled', null);
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<!doctype html>
<html lang="en">
<head>
  <title>javascript problem</title>
</head>
<body>
  
<div id='div1' class="first current">
  <p>
    here the content of div 1
  </p>
</div>

<div id='div2'>
  <p>
    here the content of div 2
  </p>
</div>
  
  //then another 9 divs
  
<div id='div12' class="last">
  <input type="submit" value="submit" onclick="submit()">
</div>

<div class="buttons">
<button id="prev" disabled="disabled">Prev</button>
<button id="next">Next</button>
</div>
  
</body>
</html>

我想要做的是在每个div而不是下面都有按钮（在div'按钮'中）。因为我希望它们不会在最后出现，我想在第一页上更改它的值。但是当我这样做时，他们不再工作了。

codesnippet不起作用但它的作用是，当你点击“下一步”时，将显示下一个div。

这就是我想要的方式：

<div id='div1' class='first current'>
<p>here the content of div 1</p>
<button id="next">Start</button>
</div>

希望其明确

Answer 1

HTML中的id属性应始终是唯一的。您应该使用id而不是在所有下一个/上一个按钮上使用相同的class。然后，您可以使用class绑定点击事件，它将适用于class的所有元素。

<button class="next">Start</button>

$('.next').click(function() { ... });

在div中调用javascript

1 个答案: