jquery - 如何在jquery中的页面加载时显示div

Question

我需要知道如何在 jQuery Mobile 的页面加载时显示特定的 div(不是页面，只是 div)。这是 HTML:

    <div data-role="page">
    <div data-role="navbar">
    <ul>
        <li><a href="#" data-href="sun">Sun</a></li>
        <li><a href="#" data-href="mon">Mon</a></li>
        <li><a href="#" data-href="tue">Tue</a></li>
        <li><a href="#" data-href="wed">Wed</a></li>
        <li><a href="#" data-href="thu">Thu</a></li>
        <li><a href="#" data-href="fri">Fri</a></li>
        <li><a href="#" data-href="sat">Sat</a></li>
    </ul>
    </div><!-- /navbar -->
    <div id="sun" class="content_div">Sunday</div>
    <div id="mon" class="content_div">Monday</div>
    <div id="tue" class="content_div">Tuesday</div>
    <div id="wed" class="content_div">Wednesday</div>
    <div id="thu" class="content_div">Thursday</div>
    <div id="fri" class="content_div">Friday</div>
    <div id="sat" class="content_div">Saturday</div>

</div>

我使用 jQuery 来协商选项卡，因此我的 JS 位于 jQuery Mobile 源调用之上。这是代码:

    function getHandler(handler) {
        var days =  ['sun','mon','tue','wed','thu','fri','sat'],
            d = new Date(),
            today = d.getDay();

        for (x=0; x<days.length; x++) {
            if ( x === today ) { handler = days[x]; }
        }
    }

    $(document).delegate('[data-role="navbar"] a', 'click', function () {
        $(this).addClass('ui-btn-active');
        $('.content_div').hide();
        $('#' + $(this).attr('data-href')).show();
    });

我的目标是当文档最初加载时，将显示与当前星期几相对应的 div

Answer 1

试试这个:

function getHandler() {
    var days = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'],
        d = new Date(),
        today = d.getDay();
    return days[today];
}

$(document).delegate('[data-role="navbar"] a', 'click', function() {
    $(this).addClass('ui-btn-active');
    $('.content_div').hide();
    $('#' + $(this).attr('data-href')).show();
});

$(document).ready(function(){
    $('[data-href="' + getHandler() + '"]').trigger('click');
})
​