。不在jquery不能正常工作

Question

經過對谷歌和各種論壇的大量研究後，我在這裏發佈這個問題。

我有5個div元素像下面 -

<div id="domain1"></div> 
<div id="domain2"></div> 
<div id="domain3"></div> 
<div id="domain4"></div> 
<div id="domain5"></div> 

當我點擊一個DIV，我想隱藏的div的其餘部分。

對於這一點，我寫的代碼作爲 -

$("#^='domain'").not(id).hide(); 

其中id是一個變量（VAR ID），其動態地保持所點擊div元素的id。

這隱藏了所有五個div元素。這不包括點擊的div元素。

請幫助，我哪裏去錯了。

Answer 1

這裏是.not（）正在做它應該做的。當然，我傳遞了clicked元素本身，而不是試圖構建一個ID選擇器來匹配。

$(document).ready(function(){ 
 
    $("div").on("click", function(){ 
 
    var clickedEl = $(this); 
 
    $("div").not(clickedEl).toggle(); 
 
    
 
    // OR ANOTHER WAY, if they're at the 
 
    // same level in the DOM. Simply comment 
 
    // out the above, and uncomment the below 
 
    // to see the same result. 
 
    // 
 
    //clickedEl.siblings("div").toggle(); 
 
    }) 
 
})

div { 
 
    height: 25px; 
 
    width: 200px; 
 
    border: 1px dotted blue; 
 
    background-color: #FFA; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="domain1">a</div> 
 
<div id="domain2">b</div> 
 
<div id="domain3">c</div> 
 
<div id="domain4">d</div> 
 
<div id="domain5">e</div>

Answer 2

您的初相匹配的ID #^='domain'的語法是不正確的 - 它缺少[]支架和使用#，而不是id。

這是你想要什麼：

$('div').click(function() { 
 
    var id = $(this).attr("id"); 
 
    console.log(id); // note it does not include the # 
 
    $("[id^='domain']").not('#'+id).hide(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="domain1">1</div> 
 
<div id="domain2">2</div> 
 
<div id="domain3">3</div> 
 
<div id="domain4">4</div> 
 
<div id="domain5">5</div>