jquery 选项卡的 onclick 事件

Question

标签中有标签。我要做的是在单击选项卡后将变量设置为某个值。因此，如果单击画笔选项卡，则该 var 设置为 true，如果选择了铅笔选项卡，则其他选项设置为 false，并且设置为 true。

现在我假设您必须在选项卡上附加一个点击事件，点击时它将调用一个函数。我的问题是如何为每个选项卡设置点击事件？ 她是我所做的一个活生生的例子：http://www.taffatech.com/Paint.html

这是我的标签页 html 代码：

<div id="tabs" style=" position:absolute; right:20; top: 30; z-index: 1; ">
  <ul>
    <li><a href="#tabs-1">Paint</a></li>
    <li><a href="#tabs-2">Shapes</a></li>
    <li><a href="#tabs-3">Save/Submit</a></li>
    <li><a href="#tabs-4">About</a></li>
  </ul>
  <div id="tabs-1">
  <div id="accordion">

    <h3>Brush</h3>
    <div>
    <center>
      <p>Brush Size</p>
    <div id="sliderBrush"></div>
    <div id="Total">10</div>

<p id="colorpickerHolder" >
                </p>

    </center>
    </div>

    <h3>Pencil</h3>
      <div>
    <center>
      <p>Pencil Size</p>
    <div id="sliderPencil"></div>
    <div id="TotalPencil">10</div>

<p id="colorpickerHolderPencil" >
                </p>

    </center>
    </div>

    <h3>Eraser</h3>
    <div>
     Coming soon!
    </div>

  </div>
</div>

Answer 1

查看 API

beforeActivate( event, ui ) 

在标签被激活之前立即触发。

    $( "#tabs-1" ).on( "tabsbeforeload", function( event, ui ) {
            //control comes here when you clicked on tab 1
    } )

http://api.jqueryui.com/tabs/#event-beforeLoad