Question

我正在使用bootstrap模式来显示持续集成式工具的构建日志，而且它们通常很长。我可以使用鼠标滚轮滚动（当然也可以使用滚动条），但箭头键和pg-up / pg-dn不起作用。有没有办法让那些工作？

Answer 1

将您的模态设为id="myModal"，并将您的内容包含在使用class="modal-body"的div中：

<script>
    $('#myModal').keydown(function(e) 
    { 
        if(e.keyCode == 40){$('.modal-body').scrollTop($('.modal-body').scrollTop()+10);}
        if(e.keyCode == 38){$('.modal-body').scrollTop($('.modal-body').scrollTop()-10);}

    }); 
</script>

Answer 2

如果页面中有多个模态，并且使用.modal scrollTop（）将始终返回第一个模态的位置。有了更多通用的解决方案，当你有很多模态时，你可以这样做：

$('.modal').keydown(function(e){
    var modalid = $('.modal.fade.in:visible').attr('id');  
    if(e.keyCode == 40){
        $('#'+ modalid +' .modal-body').scrollTop($('#'+ modalid +' .modal-body').scrollTop() + 10);
    }
    if(e.keyCode == 38){
        $('#'+ modalid +' .modal-body').scrollTop($('#'+ modalid +' .modal-body').scrollTop() - 10);
    } 
});

使用键盘在Twitter的Bootstrap 2.x模式弹出窗口中滚动

2 个答案: