如何添加動態標籤上按一下按鈕，但只有一次

Question

昨天我嘗試使用遵循

$(document).ready(function() { 
     var tabs = $("#container-1").tabs(); 
      var tabCounter = 1; 

     $('#add_tab').click(function(){ 
      var ul = tabs.find("ul"); 
      $("<li><a href='#fragment-4'>Call Detials</a></li>").appendTo(ul); 
      tabs.tabs("refresh"); 
      tabs.tabs('select', 1); 
      tabs.append($('#fragment-4')); 
     }); 
    }); 

但是，使用上面的代碼，當onclick事件火災產生一個新的標籤，我不想多相同的選項卡，所以如果它已經添加，則希望避免添加相同的選項卡。 如果已經添加，請建議我避免同一個標籤的任何條件？

Answer 1

試試這個，

$('#add_tab').click(function(){ 
    var ul = tabs.find("ul"); 
    var flag=true; 
    $(ul).find('li').each(function(){ 
     if($(this).text()=='Call Detials') 
     { 
      // to prevent from creating a new tab under ul 
      flag=false; 
     } 
    }); 
    if(flag)//if true then create the tab Call Details 
    { 
     $("<li><a href='#fragment-4'>Call Detials</a></li>").appendTo(ul); 
     tabs.tabs("refresh"); 
     tabs.tabs('select', 1); 
     tabs.append($('#fragment-4')); 
    } 
}); 

Answer 2

你可以把一切都相同，但換到.one event handler，其中一個呼叫

$(document).ready(function() { 
    var tabs = $("#container-1").tabs(); 
     var tabCounter = 1; 

    $('#add_tab').one('click', function(){ 
     var ul = tabs.find("ul"); 
     $("<li><a href='#fragment-4'>Call Detials</a></li>").appendTo(ul); 
     tabs.tabs("refresh"); 
     tabs.tabs('select', 1); 
     tabs.append($('#fragment-4')); 
    }); 
});