javascript - jquery初始化多个选项卡

标签 javascript jquery jquery-ui

在下面的代码中,我尝试初始化两个选项卡控件(actions-poweractions-access),但初始化仅针对第一个选项卡控件进行,不是都。我该如何解决它?

<div id="action-tabs">
        <ul class="tabs" id="actions-power">
            <li class="active"><a href="#action-power_cycle" data-toggle="tab">Power Cycle</a></li>
            <li><a href="#action-power_off" data-toggle="tab">Power Off</a></li>
        </ul>
        <ul class="tabs" id="actions-access">
            <li class="active"><a href="#action-console" data-toggle="tab">Console Access</a></li>
            <li><a href="#action-reset_root_password" data-toggle="tab">Reset Root Password</a></li>
        </ul>

        <div class="tab-contents">
           <div id="action-power_off">
                <p>This will power off your pc.</p>
                <p>...</p>
           </div>
           <div class="" id="action-power_cycle">
                <p>This will reboot your pc.</p>
                <p>...</p>
           </div>
           <div id="action-console">
                <p>...</p>
           </div>
           <div id="action-reset_root_password">
                <p>...</p>
          </div>
</div> 

<script>
    $(document).ready(function () {
        $("#action-tabs").tabs();
        });
</script>

最佳答案

据我所知,选择一个 id 只会选择它遇到的第一个项目。如果您想一次选择多个对象,则需要找到另一种方法来选择对象。例如,尝试为每个元素指定一个类,然后选择该类而不是 id。

关于javascript - jquery初始化多个选项卡,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23327328/

相关文章:

JavaScript在html5输出标签中显示html文本输入

javascript - 在 Angular2 中订阅 EventEmitter 不起作用

javascript - 页面刷新后,Ajax POST 到 Flask 不起作用

javascript - jQuery:如何让回调函数只运行一次

javascript - 从 url 中获取数字

javascript - navigator.geolocation.getCurrentPosition() : fire callback if user says "no"?

javascript - 在单击按钮时调整 div 的大小,这应该使用 AJAX 完成吗?

jQuery UI 自动完成从 php 脚本获取响应

javascript - 验证表单中的 jQuery-UI Spinner

javascript - 为什么当我在 IE7 中隐藏 DIV 时,我的单选按钮全部取消选择?