在所选选项卡中选择元素以填充内容

时间:2012-12-24 20:53:12

标签: javascript jquery jquery-ui jquery-tabs

我有一个动态jQuery函数,我在其中动态添加jquery选项卡。它产生如下的HTML

<div id="chattabs" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
    <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
        <li class="ui-state-default ui-corner-top" id="some_7"><a href="#ui-tabs-2"><span>Tsefolasha Sefolasha</span></a></li>
        <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active" id="some_9"><a href="#ui-tabs-4"><span>Emaynor Maynor</span></a></li>
    </ul>
    <div id="ui-tabs-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
        <ul id="messagelist_7">
        </ul>
    </div>
    <div id="ui-tabs-4" class="ui-tabs-panel ui-widget-content ui-corner-bottom">
        <ul id="messagelist_9">
        </ul>
    </div>
    <input type="text" value=" " id="msg">
    <input type="button" value="send" id="send">
    <div id="ui-tabs-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom"></div>
    <div id="ui-tabs-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide"></div>
</div>

现在,当用户点击底部的按钮发送时,我需要为每个标签添加内容。

之类的东西
$('#message_9').append('<li>' + message + '</li>');

我该怎么做?

另外,如何从chattabs div之外获取此ID?

1 个答案:

答案 0 :(得分:1)

初始化标签时,您可以使用activate事件。

$( "#chattabs" ).tabs({
    activate: function( event, ui ) {

        //Append something to the active tab
        ui.newPanel.append();

        //Get the active tab`s nested ul
        var ul = ui.newPanel.find('ul');

        //Get the id of the active tab's nested ul
        var ul_id = ul.attr('id');


    }
});