javascript - 如何一个接一个地运行一个脚本？

Question

我有一个浏览器调整大小脚本：

$(document).ready(function() {
    $(window).on('resize', function() {
        if ($(this).height() <= 800) {
            $('.content').css('max-height', '500px'); //set max height
        } 
        else {
            $('.content').css('max-height', ''); //delete attribute
        }
    }).resize()
})

我想让 jscrollpane 在窗口调整大小后运行，因为那是我需要滚动条的时候。在当前代码中，我只显示常规滚动条。

$(function() {
    $('.scroll-pane').jScrollPane();
});

有没有办法在最大高度脚本完成后运行这个脚本？

Answer 1

<script type="text/javascript">
$(document).ready(function() {

   $(window).on('resize', function(){
     if ($(this).height() <= 800){
      $('.content').css('max-height', '500px'); //set max height
     } else{
      $('.content').css('max-height', ''); //delete attribute
   }

   $('.scroll-pane').jScrollPane(); //why not call it here?

 }).resize()
})
</script>

Answer 2

你只是在这里调用一个方法：

$('.scroll-pane').jScrollPane();

..JavaScript 完全有能力在单个脚本块中做更多的事情。您不必将每个操作视为单独的脚本。

因此，只需将您的方法调用放在 resize-event-handler 中，例如：

$(window).on('resize', function(){
    if ($(this).height() <= 800){
        $('.content').css('max-height', '500px'); //set max height
    } else{
      $('.content').css('max-height', ''); //delete attribute
    }

    $('.scroll-pane').jScrollPane(); // just call it here!
}

..你完成了。

阅读一些关于 JavaScript 的文章可能会很有用。或者一些书。

一些不错的起点：
http ://www.w3schools.com/js/default.asp
http://www.codecademy.com/

享受！