2

Yii Bootter で TbTabs を使用しているときに、タブ イベントの変更を制御するにはどうすればよいですか?

これが私のコードです（ただし、タブを変更してもアラートは出ませんでした）：

$this->widget('bootstrap.widgets.TbTabs', array(
        'type' => 'tabs',
        'tabs' => array(
            array('label' => 'Trainer Modules', 'content' => 'content tab 1',
            array('label' => 'Default Modules', 'content' => 'content tab 2',
        ),
        'events' => array(
            'change' => "js:function(){alert('123');}"
        )
    ));
4

3 に答える 3

4

今後の参考のために、TbTabs のタブ クリックを制御する 1 つの解決策は、各タブに Id を割り当て、ClientScript を使用してイベントを処理することです。

次のように、各リンクに ID を割り当てます。

$this->widget('bootstrap.widgets.TbTabs', array(
    'type'=>'tabs',
    'placement'=>'above', // 'above', 'right', 'below' or 'left'
    'tabs'=>array(
        array('label'=>'Section 1', 'active'=>true, 'linkOptions' => array('id'=>'link1')),
        array('label'=>'Section 2', 'linkOptions' => array('id'=>'link2')),
    ),
));

次に、CClientScript を使用して js を登録します

Yii::app()->clientScript->registerScript("link1Click", "$('#link1').click(function(){alert('link1 is clicked');})");
Yii::app()->clientScript->registerScript("link1Click", "$('#link2').click(function(){alert('link2 is clicked');})");
于 2013-08-24T14:49:14.760 に答える
0

TbTabは正常に動作していますが、 のchangeイベントはありませんBootstrap Tab。 js のドキュメント (該当するイベント)は
次の場所にあります。Bootstrap Tab

したがって、コードを機能させるには少し変更する必要があります。

$this->widget('bootstrap.widgets.TbTabs', array(
        'type' => 'tabs',
        'tabs' => array(
            array('label' => 'Trainer Modules', 'content' => 'content tab 1',
            array('label' => 'Default Modules', 'content' => 'content tab 2',
        ),
        'events' => array(
            'show.bs.tab' => "js:function(tab){console.log(tab); alert(tab);}" // Occurs when the tab is about to be shown.
            'shown.bs.tab' => "js:function(tab){console.log(tab); alert(tab);}" // Occurs when the tab is fully shown (after CSS transitions have completed)
        )
    ));

本当の功績は別のスタックの質問に行くべきです

于 2016-01-19T13:28:10.453 に答える