javascript - 如何禁用 spry 选项卡式面板中的选项卡单击？

Question

到目前为止，我已经编写了将选项卡的显示属性设置为无的代码，直到单击该按钮为止。代码如下。

问题是一次只显示一个选项卡。我想要的是，所有选项卡都应该可见但不可点击。如果可能，请帮助我编写代码或者给我一些建议，我会尝试自己编写代码并将其发布在这里作为答案。

谢谢!

在

<div id="TabbedPanels1" class="TabbedPanels">
    <ul class="TabbedPanelsTabGroup">
      <li class="TabbedPanelsTab" tabindex="-1" id="tab1"><b>BOOKING</b></li>
      <li class="TabbedPanelsTab" tabindex="-1" id="tab2" style="">QUOTE</li>
      <li class="TabbedPanelsTab" tabindex="-1" id="tab3">SIGNUP</li>
      <li class="TabbedPanelsTab" tabindex="-1" id="tab4">PAYMENT</li>
    </ul>

In(只有第一个标签可见，其他标签不可见)

<script type="text/javascript">
$(document).ready(function(){

    /*initially hide all tab except tab1*/
    $('.TabbedPanelsTabGroup').children().hide().eq(0).show();

    /*show tab2 when click the complete button by hiding all tabs*/
    $('.complete').on('click', function(){
         $('#tab2').siblings().slideUp();
        $('#tab2').slideDown();
    });
});
</script>

在 JS 中:(在单击按钮时)(这样第二个选项卡将可见，其余 3 个选项卡将不可见)

TabbedPanels1.showPanel(1);

$('.TabbedPanelsTabGroup').children().hide().eq(1).show();

Answer 1

试试这个

$('.TabbedPanelsTabGroup').off("click");

或

$('.TabbedPanelsTabGroup li').off("click");

jQuery off() .

如果它不起作用，请告诉我。

更新 1

$('.TabbedPanelsTabGroup li').on("click", function(){
   return false;
});

或者，如果您使用的是 jquery 选项卡，请查看:http://jqueryui.com/demos/tabs/#event-select