1、实例背景
EasyUI选项卡Tabs,获取选中第几个并打印Tabs标签内容
2、实现实例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>EasyUI之选项卡Tabs</title>
<link rel="stylesheet" href="../themes/black/easyui.css" />
<link rel="stylesheet" href="../themes/icon.css" />
<link rel="stylesheet" href="../css/demo.css" />
<script type="text/javascript" src="../js/jquery.min.js" ></script>
<script type="text/javascript" src="../js/jquery.easyui.min.js" ></script>
<script>
$(function(){
$('#season').tabs({
border:false,
onSelect:function(title){
var tab = $('#season').tabs('getSelected');
var index = $('#season').tabs('getTabIndex',tab);
alert("您选中是第"+(index+1)+"个,名称是:"+title);
}
});
});
</script>
</head>
<body>
<div id="season" class="easyui-tabs" style="width:1340px;height:620px">
<div title="春季" data-options="closable:true" style="padding:10px">
</div>
<div title="夏季" data-options="closable:true" style="padding:10px">
</div>
<div title="秋季" data-options="closable:true" style="padding:10px">
</div>
<div title="冬季" data-options="closable:true" style="padding:10px">
</div>
</div>
</body>
</html>
3、实现结果