Javascript JQuery UI选项卡-动态添加和删除鼠标悬停事件

我想在用户单击复选框时将鼠标悬停事件添加到UI选项卡条中，但动态添加和删除事件时遇到问题。这是我到目前为止所拥有的

<script type="text/javascript">

 $(function() {  

  // add mouseover event when user clicks on checlkbox called chkbEnableMouseOver
  $("#chkbEnableMouseOver").change(function () { 
   if (($("#chkbEnableMouseOver").is(":checked"))){
    $('#tabs').tabs.live("click",function(){   });
   }
   else{    
    $('#tabs').tabs.live("click",function(){   event: 'mouseover'; });
   }
    });

 // UI tab strip - no default mouseover event
 $("#tabs").tabs({   });
 // UI tab strip - WITH default mouseover event
 //$("#tabs").tabs({  event: 'mouseover' });



 });
</script>

<input TYPE="checkbox" id="chkbEnableMouseOver" >enable mouseover on tabs


<div id="tabs"> 
// tabs go here
</div>

$（函数（）{
//当用户单击名为chkbEnableMouseOver的checlkbox时添加鼠标悬停事件
$（“#chkbEnableMouseOver”）.change（函数（）{
如果（$（“#chkbEnableMouseOver”）.是（“：选中”））{
$（'#tabs'）.tabs.live（“单击”，函数（）{}）；
}
否则{
$（'#tabs'）.tabs.live（“单击”，函数（）{event:'mouseover'；}）；
}
});
//UI选项卡条-无默认鼠标悬停事件
$（“#制表符”）.tabs（{}）；
//UI选项卡条-带有默认鼠标悬停事件
//$（“#tabs”）.tabs（{event:'mouseover'}）；
});
在选项卡上启用鼠标悬停
//标签在这里

试试这个。选中该框时，它会将鼠标悬停处理程序添加到选项卡条中的所有列表元素，取消选中时将其删除

 $("#chkbEnableMouseOver").change(function () { 
   if (($("#chkbEnableMouseOver").is(":checked"))){
    $('#tabs > ul > li').bind('mouseover', function() {
        ... do something on mouseover
    });
   }
   else{    
    $('#tabs > ul > li').unbind('mouseover');
   }
 });