0

嗨，我的 div 结构如下

<div id="header">HI</div>
<div id="content">HI Good morning </div>
<div id="footer">Last </div>

最初所有的 div 都是可见的。我在页面顶部有一个按钮。在第一次单击时光标必须进入第一次<div id="header">HI</div>在第二次单击时光标应移至 <div id="content">HI Good morning </div>第三次单击时光标将移至 <div id="footer">Last </div>反之亦然。

请任何人对此提供帮助。在此先感谢。

4

3 回答 3

1

我不认为 div 支持 .focus()，但是您可以创建自己的焦点。

无论您收到多少这些“消息”，您都可以简单地使用索引值来选择每个 div。我为此使用了eq()选择器。现在每次单击按钮时，它将选择第一个索引（第一个索引为 0 与 eq() 选择器）。当您再次单击该按钮时，选择器应选择第二个索引（索引 1）。
为此，您可以简单地创建一个每次单击按钮时都会增加的 div。

var clickIndex = 0;

$('button').click(function()
{


    $('div:eq(' + clickIndex + ')');

    clickIndex = clickIndex + 1;
})

现在你想在 div 高度滚动页面。您可以使用动画或哈希重定向来做到这一点。

动画

所以你想要做的是将浏览器的滚动条动画到你的 div 的顶部位置。要获得最高位置，您可以使用offset()。 

$('html,body').animate({
scrollTop: $('div:eq(' + clickIndex + ')').offset().top
},
'slow');

jsFiddle

现在，您可能希望在选择最后一条消息后重置 clickIndex 变量。

哈希重定向

您可能知道“哈希”代表将被选中的 id。基本上，当 #id 放在 url 之后时，将选择该特定 id。
通常，您可以使用锚散列href。但是通过一个按钮，您可以使用window.location.hash它。这将使用您的输入扩展 url。
您将执行与动画相同的操作，但这次您还需要每个元素的 id。


只需获取所选元素的 id 并将其存储在变量中：

var id = $('div:eq(' + clickIndex + ')').attr('id');


现在用这个 id 和哈希扩展 url：

window.location.hash = '#' + id;

jsFiddle

注意：这在 jsFiddle 中不起作用，请在您自己的代码中进行测试！

我希望这就是你要找的！

于 2013-10-21T08:26:45.513 回答
0

尝试在每个 div 周围添加一个带有 onclick 属性的锚标记，以关注下一个 id。

很抱歉含糊不清，我已经做了很长时间了，但搜索重点是 w3c 学校，这将更有意义。

于 2013-10-21T07:21:40.563 回答
0

首先，您不能专注于 div 您可以专注于输入类型，并且该方法是：

var tab = 0;
  $("#buttonID").click(function(){
    if(tab == 0){
      $("#firstID").focus();       //first click
      tab=1;
    }
    else if(tab == 1){
      $("#secondID").focus();      //second click
      tab=2;
    }
    else if(tab == 2){
      $("#thirdID").focus();      //third click
      tab=0;
    }
 });
于 2013-10-21T07:29:54.510 回答