打开的标签计数 - jquery

你能帮我找出有多少标签已经在div中打开，因为我必须将打开的标签限制为2.如果打开的标签计数是2并且试图添加一个标签那么需要提醒（'允许的最大标签数超过，先关闭一个标签'）？打开的标签计数 - jquery

<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <meta name="keywords" content="jquery,ui,easy,easyui,web"> 
    <meta name="description" content="easyui help you build your web page easily!"> 
    <title>jQuery EasyUI Demo</title> 
    <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css"> 
    <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css"> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script> 
    <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script> 
    <script> 
     function addTab(title, url){ 


      if ($('#tt').tabs('exists', title)){ 
       $('#tt').tabs('select', title); 
      } else { 
       var content = '<iframe scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:100%;"></iframe>'; 
       $('#tt').tabs('add',{ 
        title:title, 
        content:content, 
        closable:true 
       }); 
      } 
     } 
    </script> 
</head> 
<body> 
    <div style="margin-bottom:10px"> 
     <a href="#" class="easyui-linkbutton" onclick="addTab('google','http://www.google.com')">google</a> 
     <a href="#" class="easyui-linkbutton" onclick="addTab('jquery','http://jquery.com/')">jquery</a> 
     <a href="#" class="easyui-linkbutton" onclick="addTab('easyui','http://yahoo.com')">easyui</a> 
    </div> 
    <div id="tt" class="easyui-tabs" style="width:400px;height:250px;"> 
     <div title="Home"> 
     </div> 
    </div> 
</body> 
</html>

来源

2015-12-31 Jaseer

请参阅我的更新及以下 – DelightedD0D

目前还不清楚如果主页选项卡数为2个允许的标签之一，但这个会做什么，你只需要改变(count > 2)需要。

$('[data-title]').click(function() { 
 
    var $this = $(this); 
 
    var title = $this.data('title'); 
 
    var url = $this.data('url'); 
 
    var count = $('#tt .panel').length; 
 
    var $container = $('#tt'); 
 
    if ($container.tabs('exists', title)) $container.tabs('select', title); 
 
    else { 
 
    if (count > 2) { 
 
     alert('maximum allowed tabs exceed, close one tab first'); 
 
    } 
 
    else { 
 
     var content = '<iframe scrolling="auto" frameborder="0" src="' + url + '" style="width:100%;height:100%;"></iframe>'; 
 
     $container.tabs('add', { 
 
     title: title, 
 
     content: content, 
 
     closable: true 
 
     }); 
 
    } 
 
    } 
 
});

<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css"> 
 
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css"> 
 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script> 
 
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script> 
 

 
<div style="margin-bottom:10px"> 
 
    <a href="#" class="easyui-linkbutton" data-title="google" data-url="http://www.google.com">google</a> 
 
    <a href="#" class="easyui-linkbutton" data-title="jquery" data-url="http://jquery.com/">jquery</a> 
 
    <a href="#" class="easyui-linkbutton" data-title="easyui" data-url="http://yahoo.com">easyui</a> 
 
</div> 
 
<div id="tt" class="easyui-tabs" style="width:400px;height:250px;"> 
 
    <div title="Home"> 
 
    </div> 
 
</div>

来源

2015-12-31 08:26:09 DelightedD0D

@Jaseer发表评论，请参阅更新我上面的代码中，我感动于计数检查，以便它不防止聚焦在标签上显示的已经存在。 – DelightedD0D

@ DelightedD0D谢谢 – Jaseer

打开的标签计数 - jquery

回答

相关问题