JavaScript, закройте вкладку при открытии другого

Question

JavaScript, закройте вкладку при открытии другого

0

Я искал ответ в течение пары часов, поэтому мне пришлось прибегнуть к приезду сюда и попросить о помощи.

Проблема: у меня есть пара href-тегов, которые открывают карту или списки в зависимости от того, на какую вкладку вы нажимаете, моя проблема: мне нужно установить карту как открытую по умолчанию, и когда вы нажмете на вкладку "Списки", карту, чтобы закрыть и открыть списки (так что в основном, когда вы нажимаете на один, другой закрывается и наоборот).

здесь мой код

HTML:

 <div class="clearfix"></div>
<a class="sortby">
    SORT BY
</a>
<a class="sortby_town" href="javascript:showDiv()">
    MAP
</a>
<a class="sortby_category" href="javascript:showListings()">
    LISTINGS
</a>

<div id="townmap" style="display: none; margin-top: 60px;">
{loadposition sawbridgeworth}
</div>

<div id="townlistings" style="display: none; margin-top: 60px;">
{component url='index.php?Itemid=132&option=com_mtree&task=search&searchword=Sawbridgeworth&cat_id=0'}
</div>

JavaScript:

function showDiv() {
document.getElementById('townmap').style.display = "block";
}

function showListings() {
document.getElementById('townlistings').style.display = "block";
}

Любая помощь будет оценена! Заранее спасибо!

Andrew Matthew 04 окт. 2013, в 12:02

Источник

Теги:

javascript

jquery

html

2 ответа

0

Попробуйте использовать element.style.display = "none"

function showDiv() {
document.getElementById('townmap').style.display = "block";
document.getElementById('townlistings').style.display = "none";
}

function showListings() {
document.getElementById('townlistings').style.display = "block";
document.getElementById('townmap').style.display = "none";
}

Чтобы показать карту при загрузке страницы, вы можете прикрепить к ней функцию, которая будет выполняться после загрузки страницы

document.attachEvent("onreadystatechange", function(){
    this.getElementById('townmap').style.display = "block";
});

Я бы всегда рекомендовал использовать jQuery поверх чистого JavaScript. Вы должны подумать об этом, если у вас его нет, так как вы обнаружите, что большинство вещей займет гораздо меньше скриптов, чем то, как вы это делаете сейчас

SixteenStudio 04 окт. 2013, в 07:21

Ещё вопросы

Nunners · Accepted Answer · 2013-10-04T08-06-00.000Z

Вы пробовали вкладки jQuery?

Это хороший плагин, который даст вам функциональность, которую вы пытаетесь создать.

Тем не менее, глядя на ваш код, почему бы вам просто не использовать строку, чтобы скрыть другой div?

function showDiv() {
    document.getElementById('townmap').style.display = "block";
    document.getElementById('townlistings').style.display = "none";
}

function showListings() {
    document.getElementById('townlistings').style.display = "block";
    document.getElementById('townmap').style.display = "none";
}

Diplay="none" скроет div. Альтернативно, если вы используете jQuery (как предлагает ваш тег), вы можете попробовать следующее:

function showDiv() {
    $('#townmap').show();
    $('#townlistings').hide();
}

function showListings() {
    $('#townlistings').show();
    $('#townmap').hide();
}

это работает! Я понятия не имею, почему я не подумал об использовании jQuery, ха-ха, наверное, я просто вытащил полный тупой момент из-за сложных вещей! Большое спасибо!