javascript - 查找所选元素的索引-6ren

javascript - 查找所选元素的索引

转载作者：行者123 更新时间：2023-11-30 17:00:53

25

4

我正在关注 Semmy Purewal 的书 Learning Web App Development学习 html/css、javascript、jQuery 等。在他的一个示例中，读者必须在网页上创建三个选项卡并编写代码，使用户单击的选项卡具有一个名为“事件”的类.

在我可以将该类添加到单击的选项卡之前，我需要找出它的索引——这就是我遇到问题的地方。

这是我的 HTML 代码:

<!doctype html>
<html>
  <head>
    ...
  </head>

  <body>
    <header>
      ...
    </header>

    <main>
      <div class="container">
        <div class="tabs">
          <a href=""><span class="active">Newest</span></a>
          <a href=""><span>Oldest</span></a>
          <a href=""><span>Add</span></a>
        </div>
        <div class="content">
          <ul>
            ...
          </ul> 
        </div>
      </div>
    </main>

    <footer>
      ...
    </footer>

    <script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
    <script src="app.js"></script>
  </body>
</html>

这是我的 jQuery 代码，用于获取用户选择的选项卡的索引(受 Purewal 的强烈影响):

var makeActiveTab = function(tabNum) {
    //make all the tabs inactive
    $(".tabs span").removeClass("active");

    //make the first tab active
    $(".tabs a:nth-child(" + tabNum + ") span").addClass("active");

    //empty the main content so we can recreate it
    $("main .content").empty();

    //return false so we don't follow the link
    return false;
};

var main = function() {
    "use strict";
    var index;
    $(".tabs a").click("click", function() {
        index = $(this).index();
    });

    console.log(index);
};

$(document).ready(main);

控制台不是获取点击选项卡的索引，而是输出“undefined”。我该怎么做才能解决这个问题？

这是我迄今为止查阅过的资源列表:

最佳答案

您需要将 console.log() 移动到点击事件中，如下所示:

var main = function() {
    "use strict";
    var index;
    $(".tabs a").click("click", function() {
        index = $(this).index();
        console.log(index);
    });


};

现在，console.log() 会在文档准备就绪时立即运行，因为它会在 main 执行时运行。因为还没有发生点击事件，所以索引变量没有值。

关于javascript - 查找所选元素的索引，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28889574/

25

4

0

文章推荐： javascript - 在 Moment.js 中从 UTC 日期字符串创建本地日期

文章推荐： c - 使用gdb调试exe

文章推荐： c# - 当实现略有不同时如何使用 DuckTyping？

文章推荐： c - Intel Edison 上的 Azure IoT 中心和 MRAA

generics - Swift 泛型函数(n 选 k)
我正在尝试用 Swift 编写这段 JavaScript 代码:k_combinations 到目前为止，我在 Swift 中有这个: import Foundation import Cocoa e

首页

博学

6Ren·AI

商城

javascript - 查找所选元素的索引