頁面加載后運行多個腳本

Question

我有以下javascripts：

<script type="text/javascript">
        $('#HomeSlideShow ul.images').jSlideshow({
            auto: true,
            delay: 15,
            indicators: '#HomeSlideShow ul.indicators'
        });
</script>

和：

<script type="text/javascript">window.onload = function () {
document.getElementById('Features').style.visibility = 'Visible';
};</script>

我想將第一個腳本合並到第二個腳本的onload函數中。 這樣，兩個腳本在頁面加載后即可運行。

Answer 1

一旦加載了DOM，它將運行。 http://api.jquery.com/ready/

$(document).ready(function() {

        $('#HomeSlideShow ul.images').jSlideshow({
            auto: true,
            delay: 15,
            indicators: '#HomeSlideShow ul.indicators'
        });

        document.getElementById('Features').style.visibility = 'Visible';

});

或.ready（）的簡稱

$(function() {

            $('#HomeSlideShow ul.images').jSlideshow({
                auto: true,
                delay: 15,
                indicators: '#HomeSlideShow ul.indicators'
            });

            document.getElementById('Features').style.visibility = 'Visible';

});

Answer 2

<script type="text/javascript">
    $(function() {
        $('#HomeSlideShow ul.images').jSlideshow({
            auto: true,
            delay: 15,
            indicators: '#HomeSlideShow ul.indicators'
        });

        $('#Features').css({ visibility: 'Visible' });
    });
</script>

使用jQuery添加任意數量的內容以在頁面加載時運行。 可以像這樣輕松完成：

<script type="text/javascript">
    $(function() {
        $('#HomeSlideShow ul.images').jSlideshow({
            auto: true,
            delay: 15,
            indicators: '#HomeSlideShow ul.indicators'
        });
    });
</script>

...

<script type="text/javascript">
    $(function() {
        $('#Features').css({ visibility: 'Visible' });
    });
</script>