Question

您好我的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>和反向光标。

请有人帮忙...提前致谢。

Answer 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变量。

哈希重定向

您可能知道'hash'代表将被选中的id。基本上，当#id放在url之后时，将选择该特定id。
通常你可以使用锚点哈希href。但是使用按钮，您可以使用window.location.hash。这会根据您的输入扩展网址。
你将和动画做同样的事情，但这次你还需要每个元素的id。

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

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

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

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

<强> jsFiddle

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

<小时/> 我希望这就是你要找的东西！

Answer 2

使用onclick属性在每个div周围尝试一个锚标记，以便专注于下一个id。

很抱歉因为我已经做了很长时间而模糊不清，但是搜索专注于w3c学校，这将更有意义。

Answer 3

首先，您无法专注于可以专注于输入类型的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;
    }
 });

如何使用单个按钮执行单击事件以选择不同的DIV

3 个答案: