jQuery更改div内容 [英] jQuery change div content
问题描述
我需要更改代码的帮助,以便单击链接ID即可更改div内容 示例:我单击第一个链接,它打印出1,然后显示一个.并且它将具有唯一链接#first. 默认情况下,它也会显示默认"
I need help changing my code so that it changes div content on click to link id example: I click first link, it prints out 1 and so one. And also it will have an unique link #first. Also by default it shows "default"
<script src="jquery.js"></script>
<script src="jquery.bbq.js"></script>
<script>
$(function () {
var tabContainers = $('div.tabs > div');
tabContainers.hide().filter(':first').show();
$(window).bind('hashchange', function () {
var hash = window.location.hash || '#first';
tabContainers.hide();
tabContainers.filter(hash).show();
$('div.tabs ul.tabNavigation a').removeClass('selected');
$('a[hash=' + hash + ']').addClass('selected');
});
$(window).trigger( "hashchange" );
});
</script>
<ul class="tabNavigation">
<li><a href="#first" id="1">First</a></li>
<li><a href="#second" id="2">Second</a></li>
<li><a href="#third" id="3">Third</a></li>
</ul>
<div class="tabs">
Change content here
</div>
推荐答案
window.location.hash
通常在没有哈希值时返回空字符串,并且您需要检查锚点href
,而不是hash
.看起来锚点也不在.tabs
元素内?
window.location.hash
normally returns an empty string when there is no hash, and you need to check the anchors href
, not hash
. It does'nt look like the anchors are inside the .tabs
element either ?
$(function () {
$(window).on('hashchange', function () {
var tabContainers = $('.tabs > div'),
hash = window.location.hash != '' ? window.location.hash : '#first';
tabContainers.hide();
tabContainers.filter(hash).show();
$('.tabNavigation li a').removeClass('selected');
$('a[href="' + hash + '"]', '.tabNavigation').addClass('selected');
}).trigger('hashchange');
});
我在找你实际上有ID匹配.tabs
中的anchors href的元素,并且这不是像示例中那样为空吗?
I'm gussing you actually have elements with ID's matching the anchors href inside .tabs
, and that is't not empty like in the example?
这篇关于jQuery更改div内容的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!