У меня здесь есть сценарий, и он работает потрясающе, за исключением одной маленькой детали.Он в основном работает как функция щелчка, которая включает и выводит определенные DIV по щелчку ссылки.
Проблема, однако, в том, что когда вы щелкаете ЛЮБОЕ на странице, он удаляет DIV и оставляет пустую область содержимого, пока вы не нажмете одну из ссылок.Очевидно, что это проблема.
Я не могу использовать точный код, который я использую по причинам NDA, но здесь та же самая установка, которую я использую с простым текстом в div.
Просто нажмите на ссылки, чтобы увидеть функциональность, а затем нажмите в любом месте на странице (в div, в пустом пространстве, что угодно) и наблюдайте, как div просто исчезает.Я знаю, что это то, что вызывает JavaScript, но я не знаю, как отключить щелчок в div, чтобы этого не произошло.Кроме того, как это сделать, чтобы не отключить ссылку, которая находится внутри этого div.
Любая помощь с благодарностью.Этот сайт спасает жизнь.
Это исходный код, который я получил с этого сайта и отредактировал, чтобы показать мой самый простой макет.По сути, это набор ссылок, которые являются встроенными и при нажатии на них они изменяют раздел DIVS на другой раздел div:
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var gLastH = null;
var gLastId = null;
$('.toggle').click(function(e) {
$('.toggleh:visible').fadeOut('slow');
gLastId = $(this).attr('id');
console.log('#' + gLastId + 'h');
gLastH = $('#' + gLastId + 'h');
$(gLastH).fadeIn('slow');
e.stopPropagation();
});
$('*').click(function(e) {
if ($(this).attr('id') != gLastId) {
$(gLastH).fadeOut('slow');
}
e.stopPropagation();
});
});
</script>
</head>
<body>
<div id="menubar">
<a href="#" onclick="return false;" class="toggle" id="toggle1" style="display: inline;">
text here</a>
<a href="#" onclick="return false;" class="toggle" id="toggle2" style="display: inline;">
text here</a>
<a href="#" onclick="return false;" class="toggle" id="toggle3" style="display: inline;">
text here</a>
<a href="#" onclick="return false;" class="toggle" id="toggle4" style="display: inline;">
text here</a>
<div class="toggleh" id="toggle1h">
some description in here I suppose
</div>
<div class="toggleh" id="toggle2h" style="display: none;">
some description in here I suppose #2dsfds sdfdsfa sdf
</div>
<div class="toggleh" id="toggle3h" style="display: none;">
some description in here I suppose #3dffdfasdfdsfdfasf
</div>
<div class="toggleh" id="toggle4h" style="display: none;">
some description in here I suppose #4 dfdafa
</div>
</div>
</body>
</html>