jQuery的：不是不工作

這裏是我的HTMLjQuery的：不是不工作

<div class="records" id="1"> 
     <div class="controls"> 
      <a class="special"> 
       <img class="1" src="special1.png" class="shown" /> 
       <img class="1" src="special0.png" class="hidden" /> 
      </a> 
     </div> 
</div> 

<div class="records" id="2"> 
     <div class="controls"> 
      <a class="special"> 
       <img class="1" src="special1.png" class="hidden" /> 
       <img class="0" src="special0.png" class="shown"/> 
      </a> 
     </div> 
</div>

這是一個什麼樣的從數據庫中檢索HTML輸出。但是有一次，只有一個圖像顯示在special1.png或special0.png的一條記錄中，但是當用戶單擊任何a.special時，我希望該記錄的special1.png可見，而其他a.special的所有圖像只能顯示special0.png。爲此，我試圖做到這一點使用此

$(".controls a").click(function() { 
    var action = $(this).attr('class'); 
    var id = $(this).parent(".controls").parent(".records").attr('id'); 

    //Now send post request and database things 
    //function(data) { //After this stage 
     $(this).children("img.1").show(); //show the active image 
     $(this).children("img.0").hide(); //hide the inactive image 

    //However this below I used :not to skip current element but it doesn't, it hides all inactive image and shows all active images 

     $("div:not(#"+id+") a.special img.1").hide(); //hide all the active image except this one 
     $("div:not(#"+id+") a.special img.0").show(); //show all the in-active image except this one 

    // } // 
});

來源

2010-11-22 mrN

@mrNepal你的代碼中有一個錯誤，不要使用數字作爲div id，它不允許使用，也不是一個好的做法。 – kobe 2010-11-22 07:49:04

@gov，對於使用ajax目的，你會建議如何保存記錄的'id'。但是，當使用數據庫提取視圖時，必須指定 – mrN 2010-11-22 07:50:47

@mrNepal使用一些其他值，如果它們是動態的給出某個名稱，然後否，則不允許使用div ID和類的數字，並且它可以給出更奇怪的結果， t顯示任何地方。 – kobe 2010-11-22 07:53:22

這將是值得嘗試的方法.not()。它使你的選擇器更清潔，並且還可以將功能作爲提供更多功能的參數。

而且，我已經提到過 - HTML4標識的一>必須以字母開頭AZ或az
B>可以跟隨：字母（A-ZA-Z），數字（0-9），連字符（「 - 」），下劃線（「_」），冒號（「：」）和句點（「。」）

來源

2010-11-22 07:58:47

你能告訴，爲什麼'：not'我是使用不在那裏工作？ – mrN 2010-11-22 08:00:43

這是一個更安全的賭注。 http://jsperf.com/jquery-css3-not-vs-not – 2010-11-22 08:50:36

我不認爲它的問題:not。

你看，在你的第一個div，這兩個圖像有class="1"。這可能是問題。嘗試將class="0"設置爲其中的一個圖像。

來源

2010-11-22 08:10:19

我同意，：不vs .not（）是「不是」這裏的問題。只是基於我過去的經驗的建議。 – 2010-11-22 09:08:11

首先，我認爲:not()失敗，因爲您使用數字作爲ID，這在HTML4中是不允許的。所有id屬性必須以字母字符開頭。你可以用r前綴你的ID，例如：

<div class="records" id="r1">

其次，你可以在此更有效地利用.not方法做：

$(".controls a").click(function() { 
    var action = this.class; 
    var record = $(this).closest(".records")[0]; // get the DOM element of the ancestor .records 

    //Now send post request and database things 
    //function(data) { //After this stage 
     $(this).children("img.r1").show(); //show the active image 
     $(this).children("img.r0").hide(); //hide the inactive image 

     $("div").not(record).find("a.special img.r1").hide(); //hide all the active image except this one 
     $("div").not(record).find("a.special img.0").show(); //show all the in-active image except this one 

    // } // 
});

注意使用

this.class代替$(this).attr('class')
.closest('.records') to f IND與類records
[0]最接近祖先元素，以獲得從jQuery選擇的DOM元素
.not(record)從集中刪除record元素
.find()找到特定選擇

匹配的所有後代元素

來源

2010-11-22 08:56:12 lonesomeday

+1用於指出.closest（）的使用。還沒有遇到它。 – 2010-11-22 09:19:25

jQuery的：不是不工作

回答

相關問題