我想在 Jquery 默认选项卡中动态附加数据 但我如何获取选定的选项卡
HTML:
<!DOCTYPE html>
<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"> </script>
</head>
<body style="font-size:62.5%;">
<div id="tabs">
<ul>
</ul>
</div>
<input type='button' id='addTab' value='Add Tab'>
<input type='button' id='appendText' value='Add Text in Tab'>
</body>
</html>
JS:
$(document).ready(function() {
$("#tabs").tabs({
tabTemplate: "<li><a href='#{href}'>#{label}</a> <p title='close' id='removeTab' style='cursor:pointer;display:inline'>x</p></li>"
});
});
$(function() {
var index = 0;
$("#addTab").live('click', function() {
index++;
var title = 'Tab..... ' + index;
var url = '#fragment-' + index;
addTab(url, title, index);
});
function addTab(url, title, index) {
$('#tabs').tabs("add", url, title, [index]);
}
$('#removeTab').live('click', function() {
selected = $('p[id=removeTab]').index(this);
$('#tabs').tabs("remove", [selected]);
});
$('#appendText').live('click', function() {
//fragment-1 is hardcoded I want to get the url of tab by clicking on it...
$('#fragment-1').append("Bla Bla!!!");
});
});
JS fiddle http://jsfiddle.net/k44Wk/2/
最佳答案
使用以下代码附加文本:
$(".ui-tabs-panel").not(".ui-tabs-hide").append("Bla Bla!!!");
这是 JSFiddle 链接..
如果您想在选项卡标题中添加文本:
$(".ui-tabs-selected").append("Bla Bla!!!");
关于javascript - 如何获取选中Tab的URL，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10528895/