jQuery的已檢測到父母不正確

我有HTML結構象下面這樣：jQuery的已檢測到父母不正確

<div id="banner-menu-holder"> 
    <div> 
     <div class="avalible"> 
      <div class="items-holder"> 
       <div> 
        <div class="img-holder"> 
         <div> 
          <input id="set_banner_29" type="checkbox" onclick="mod.setBanner(29);"> 
          ... 
         </div> 
        </div> 
       </div> 
       ... 
      </div> 
     </div> 
     <div class="ready"> 
      <div class="items-holder"> 
       <div> 
        <div class="img-holder"> 
         <div> 
          <input id="rem_banner_1_8_32" class="remove_banner" type="checkbox" checked="checked"> 
          ... 
         </div> 
        </div> 
       </div> 
       ... 
      </div> 
     </div> 
    </div> 
</div>

和JS代碼：

$(document).click(function(ev) { 
    if ($(ev.target).parents().index($('#banner-menu-holder')) == -1) { 
     $('#banner-menu-holder').css('display', 'none'); 
    }   
})

當我點擊複選框到第一個div（類avalible）然後功能已被全成執行 - 這個chekbox是主div（＃banner-menu-holder）的孩子。

當我點擊第二個div的複選框，並且該功能沒有工作。 jQuery沒有檢測到這些複選框是主div的子項。

這個問題到jQuery或其他？

來源

2012-05-15 diNord

是什麼讓你覺得函數沒有執行？既然它們都是從'＃banner-menu-holder'下降的，'.index（）'不會返回'-1'，所以什麼也不應該發生。 –

好像你正在做的事件委託，但在一個非常笨拙的方法。

jQuery通過.on()更容易。

$(document).on('click', '#banner-menu-holder', function(ev) { 
    $('#banner-menu-holder').css('display', 'none'); 
}); 
$(document).on('click', ':not(#banner-menu-holder)', function(ev) { 
    $('#banner-menu-holder').css('display', 'none'); 
});

如果你正在使用jQuery 1.4-1.6.x，你會使用.delegate()代替。

$(document).delegate('#banner-menu-holder', 'click', function(ev) { 
    $('#banner-menu-holder').css('display', 'none'); 
}); 

$(document).delegate(':not(#banner-menu-holder)', 'click', function(ev) { 
    // do something else 
});

來源

2012-05-15 15:08:55

正如我理解你，我應該綁定點擊.remove_banner，但我沒有這個類的複選框。當通過＃banner-menu-holder div將onClick綁定到它時，它的工作不正確。 – diNord

我忘記提及，在函數IF之後，如果當前元素沒有parent＃banner-menu-holder（頁面中所有其他元素），則應執行ELSE。對不起我的英語不好。 – diNord

所以你說在橫幅內任何地方點擊都應該隱藏橫幅？如果是這樣，只要刪除我的答案中選擇器的'.remove_banner'部分。 –

嘗試使用closest()檢查，如果當前元素具有與banner-menu-holder ID父：

if (!$(ev.target).closest('#banner-menu-holder').length) { 
    $('#banner-menu-holder').css('display', 'none'); 
}

來源

2012-05-15 14:58:13

我不完全知道你正在嘗試做的，但如果你想看看是否點擊的元素是#banner-menu-holder元素我會寫它像這裏面：

if($(ev.target).closest('#banner-menu-holder').length > 0) { 
    ... 
}

來源

2012-05-15 14:59:05

我已經嘗試你的代碼，並有一個有趣的事情 - 複選框到第一個div沒有工作，但進入第二個div一切都好。他們交換！ – diNord

jQuery的已檢測到父母不正確

回答

相關問題