我需要动态更改 Tab 文本,我可以做到,但是当我更改文本时,设计会发生变化,看起来很糟糕。
这是我得到的:
$("#tabstrip").kendoTabStrip({
select: tabstrip_select
});
function tabstrip_select(e) {
var x = e.item;
$(x).text($(x).text() + ' - plus changed text');
//alert('Tab text: ' + $(x).text());
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.common.min.css" rel="stylesheet"/>
<link href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.default.min.css" rel="stylesheet"/>
<script src="http://cdn.kendostatic.com/2011.3.1129/js/kendo.all.min.js"></script>
<div id="tabstrip">
<ul>
<li>Online</li>
<li>Trading</li>
<li>Whatever</li>
</ul>
<div style="min-height:350px;"></div>
<div style="min-height:350px;"></div>
</div>
这是一个 Fiddle
我不知道为什么在更改文本后搞砸了,但我需要的是在不影响其他任何内容的情况下更改文本。
最佳答案
function tabstrip_select(e) {
$('#tabstrip ul li .k-link .plusText').remove();
$(e.item).find('.k-link').append('<span class="plusText"> - plus changed text</span>');
}
你还需要加一个
<div style="min-height:350px;"></div>
更新:
function tabstrip_select(e) {
var tab = $('#tabstrip ul li .k-link:contains("Online")');
tab.find('.plusText').remove();
tab.append('<span class="plusText"> - selected '+$(e.item).find('.k-link').text()+'</span>');
}
关于javascript - 更改 Kendo 标签条文本会动态改变样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33957172/