нажмите, чтобы показать или нажмите на улицу или на ту же кнопку, чтобы скрыть

У меня есть этот код:нажмите, чтобы показать или нажмите на улицу или на ту же кнопку, чтобы скрыть

$(document).on('click', function(e) { 
    var elem = $(e.target).closest('#click'), 
     box = $(e.target).closest('#box'); 

    if (elem.length) { 
     e.preventDefault(); 
     showbox(); 
    }else if (!box.length){ 
     hidebox(); 
    } 
});

Так что, если showbox(); линия: $('#box').toggle(); это прекрасно работает. Но если я использую скрипт без переключения, скрытие кнопки перестает работать.

Вот полный пример со всеми деталями внутри: http://jsfiddle.net/8SFMw/

источник

2014-01-07 Simon

Я забыл упомянуть, что, когда я нажимаю на поле он не должен исчезнуть, но я подумайте, что вы уже заметили это по сценарию. – Simon

Это не имеет никакого отношения к функции showbox(), ее elem.length всегда будет возвращать 1 и, следовательно, всегда будет правдой.

попробовать использовать .is(":visible"), что-то вроде ...

$(document).ready(function(){ 
    $('#click').click(function(){ 
     if ($('#box').is(":visible")){ 
      hidebox(); 
     }else{ 
      showbox(); 
     } 
    }); 
});

источник

2014-01-07 00:53:23 Schmalzy

будет работать отлично, если внешний щелчок окна будет работать также. Спасибо вам все равно – Simon

Я просто попробовал добавить '$ ('# box'). Click (function() {event.stopPropagation();});' с вашим предложением, и это помогло. Он работает именно так, как мне нужно, чтобы он работал. спасибо вам и всем, кто предложил подобное решение! Вот рабочий пример: http://jsfiddle.net/8SFMw/10/ – Simon

@Simon Нет проблем, я не понимал, что вы хотите скрыть \ показать окно, когда на экране щелкнуло ANYWHERE, я предположил, что вы только хотели его происходят, когда кнопка нажата. Но рад, что ты заработал. – Schmalzy

Он не перестанет работать. Ваше утверждение if становится истинным каждый раз, и ваш оператор else никогда не выполнялся. Поэтому вы должны изменить свою логику. В случае, если .toggle() даже ваша логика выполняет, если оператор будет переключать отображение и скрытие. Для лучшей практики см. Это DEMO.

В CSS:

#box 
{ 
    padding:10px; 
    border:solid; 
    display:none; 
    margin-top:0px; 
} 

#box.show 
{ 
    margin-top:0px; 
    display:block; 
} 

#box.hide 
{ 
    margin-top:1px; 
    display:none; 
}

В JS:

var $box = $('#box'); 
$(document).on('click', function(e) {  
    if ($box.hasClass('show')) 
    { 
     $box.removeClass('show').addClass('hide'); 
     //Some code here 
    } 
    else 
    { 
     $box.removeClass('hide').addClass('show'); 
     //Some code here 
    } 
});

Так, конечно, я предполагаю, что вы хотите использовать какую-либо другую логику в будущем, так что это решение для Вас , Если вы хотите просто показать и скрыть в этом случае, просто используйте переключатель с другой логикой.

источник

2014-01-07 00:46:08 Khamidulla

Я забыл упомянуть, что когда я нажимаю на ящик, он не должен исчезать, но я думаю, вы уже заметили это в скрипте. Однако ваш скрипт не делает именно то, что мне нужно, оно исчезает при щелчке по ящику и при загрузке страницы первый щелчок на кнопке не работает. Спасибо за вашу помощь! – Simon

Если я правильно понимаю, окно не исчезает при нажатии на button#click при использовании showbox() вместо .toggle().

Это связано с тем, что, когда вы нажимаете на кнопку непосредственно, ваш elem.length != 0. Другими словами, он никогда не запускает код внутри вашего оператора else if.

источник

2014-01-07 00:53:32 mikeba

вашего Windows, если условие не работает, то вы можете сделать это с

if ($('#box').is(":hidden")) { ...}else{...}

как это: jsfiddle

источник

2014-01-07 01:02:49 ilias

извините, но это не поможет. Мне нужно работать точно так же, как на примере только с функцией вместо переключения – Simon

нажмите, чтобы показать или нажмите на улицу или на ту же кнопку, чтобы скрыть

ответ

Смежные вопросы