如何在父div內為div設置焦點？

Question

<html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#container2").focus();
        });
    </script>
</head>

<body>
    <div id="mainwrapper">
        <!-- container1 -->
        <div id="container1" 
             style="height:100px;width:299px;">
            First Lorem Ipsum is simply dummy text1 
        </div>

        <!-- container2 -->
        <div id="container2"  style="height:100px;width:299px;">
            Second Lorem Ipsum is simply dummy text2
        </div>

    </div>
</body>

這是我的html代碼，當頁面加載時應將焦點放在第二個div上，但這不起作用，請提前謝謝我。

Answer 1

.focus()不會滾動到指定的div.use：

$(document).ready(function() {
   $('html, body').animate({ scrollTop: $('#container2').offset().top }, 'slow');
});

工作演示

Answer 2

這可能會滿足您的需求。 首先，將class="borderonload"為#container2 ，然后添加以下CSS：

#mainwrapper div:hover, .borderonload {
    border: 2px solid #aaf;
}

在腳本中：

$('#mainwrapper').on('mousemove', function (e) {
    var $cont2 = $('#container2');
    if (e.target !== $cont2) {
        $cont2.removeClass('borderonload');
        $('#mainwrapper').off('mousemove');
    }
});

jsFiddle上的現場演示。

如何在父div內為div設置焦點？

問題描述

2 個解決方案

解決方案1
0 2014-04-03 14:40:15

解決方案2
0 已采納 2014-04-03 15:34:49

如何在父div內為div設置焦點？

問題描述

2 個解決方案

解決方案1 0 2014-04-03 14:40:15

解決方案2 0 已采納 2014-04-03 15:34:49

解決方案1
0 2014-04-03 14:40:15

解決方案2
0 已采納 2014-04-03 15:34:49