jquery ui 1.7 ui.tabs 动态添加与关闭(按钮关闭+双击关闭) 【转载】(http:www.cnblogs.comlijia7436archive201003311701193.html)

1$(document).ready(function(){ 2      $('#tabs').tabs({add:addEventHandler});  //给tabs块绑定addEventHandler事件 3      $('#newtabs').click(addTab); 4 5}) 6 7var tabCounter = 1;         8function addTab(){ 9    if(tabCounter > 6){10        alert('tabs can not more than 6!');11        return;12    }13    $('<div id="new-tab-'+tabCounter+'">'+'New tab'+tabCounter+'</div>').appendTo('#tabs');14    $('#tabs').tabs("add","#new-tab-"+tabCounter,'New tab'+tabCounter);15    tabCounter++;16}17function addEventHandler(event,ui){18    var li = $(ui.tab).parent();19    $('<img src="close.gif"/>') //关闭按钮20        .appendTo(li)21        .hover(function(){22                var img = $(this);23                img.attr('src','close_hover2.png');24            },25            function(){26                var img = $(this);27                img.attr('src','close.png');28            }29        )30        .click(function(){        //关闭按钮,关闭事件绑定31            var li = $(ui.tab).parent();32      var index = $('#tabs li').index(li.get(0));33      $("#tabs").tabs("remove",index);34      tabCounter--;35        });36        $(ui.tab).dblclick(function(){   //双击关闭事件绑定37            var li = $(ui.tab).parent();38      var index = $('#tabs li').index(li.get(0));39      $("#tabs").tabs("remove",index);40      tabCounter--;41        });42}