是否可以在一個函數中列出多個ID，這不會觸發一個.hide函數？

Question

我的幻燈片在菜單中出現問題。在這裏檢查我的JSfiddle。 目前滑入式菜單關閉，每當點擊菜單本身以外的其他東西。問題是，菜單關閉，當我點擊文本。我想或許在同一個函數中列出更多的ID，就像這樣;

if(isOpened && e.target.id!='slide-in,text') 

我的腳本：

var isOpened = false; 
    $(document).click(function(e) { 
     if(isOpened && e.target.id!='slide-in') { 
     $("#slide-in").removeClass("active"); 
     isOpened = false; 
     $("#button").show(); 
     } else if(!isOpened && e.target.id=='button'){ 
     $("#slide-in").addClass("active"); 
     isOpened = true; 
     $("#button").hide; 
     } 
    }); 

謝謝！

Answer 1

不是檢查所有id S，檢查與id父的存在作爲slide-in

if(isOpened && e.target.id!='slide-in') { 
    if(!$(e.target).parents('#slide-in').length) { 
     $("#slide-in").removeClass("active"); 
     isOpened = false; 
     $("#button").show(); 
    } 
} 

檢查這個fiddle

Answer 2

您可以使用數組和indexOf

['slide-in', 'text'].indexOf(e.target.id) === -1 

我可能會建議你添加一個類你不想它應用到的元素？

!$(this).is('.someClass') 

Answer 3

#slide-in { 
    position: fixed; 
    z-index: 10; 
    top: 0; 
    width: 300px; 
    height: 100%; 
    background-color: #eee; 
    border-right: 10px solid #ccc; 
    display:none; 
} 

，並添加這裏面的.js

$(document).ready(function(){ 
     $("#button").click(function(){ 
     $("#slide-in").show(300); 
     }) 
     $("#slide-in").click(function(){ 
     $(this).hide(300); 
     }); 

    }); 

，如果你想要更多的實際使用此。 在css改變這個類像這樣

#slide-in { 
     position: fixed; 
     z-index: 10; 
     top: 0; 
     width: 0px; 
     height: 100%; 
     background-color: #eee; 
     border-right: 10px solid #ccc; 
     display:none; 
    } 

您js

$(document).ready(function(){ 
     $("#button").click(function(){ 
      $("#slide-in").animate({width: "300px"}); 
      }); 
     $("#slide-in").click(function(){ 
      $(this).animate({width: "0px"}); 
     }); 
    });