什麼是最好的jQuery選擇器進行此更改？

我有以下的HTML，我使用jQuery的方法（）來堅持一些新的HTML。這工作得很好，但我現在有一種情況，我不希望它在特定條件下（其中一個額外的類存在於頂級TD中）應用after（）方法，並且我試圖找出正確的jquery選擇器語法。什麼是最好的jQuery選擇器進行此更改？

爲了使這更具體，開始，我有以下的html：

<td class="fc-widget-content"> 
<div> 
     <div class="fc-day-number">1</div> 
     <div class="fc-day-content"> 
    </div> 
    </td>

，我想下面的邏輯：我要堅持這個網站：

 <span class="addEventHidden" style="display: none;"> 
      <img src="/Content/Images/addEvent.gif"> 
     </span>

後

權fc-day-number div。我可以這樣做很容易地做到這一點：

$('.fc-day-number').after(function() { 
    return "<span class='addEventHidden' style='display: none;'><img src='/Content/Images/addEvent.gif'></span>"; 
});

這個偉大工程，除了在某些情況下，我不希望運行。經過（）方法，如果頂部div有這個額外的類：FC-其他 - 一個月

命令後，所以將此如果頂部看起來是這樣的：

<td class="fc-widget-content">

但如果上TD是這樣的：

<td class="fc-widget-content fc-other-month">

來源

2012-04-09 leora

嘗試：

$('td.fc-widget-content:not(.fc-other-month) div.fc-day-number') 
    .after('<span class="addEventHidden" ... >');

實施例具有用於清晰度換行符。用合法的html替換<span class="addEventHidden" ... >。

來源

2012-04-09 19:40:12 iambriansreed

$('.fc-widget-content .fc-day-number').not('.fc-other-month .fc-day-number').after(function() { 
    return "<span class='addEventHidden' style='display: none;'><img src='/Content/Imags/addEvent.gif'></span>"; 
});

來源

2012-04-09 19:35:12 joeljoeljoel

'fc-other-month'是父類。 – 2012-04-09 19:37:16

fc-other-month不會成爲與fc-day-number相同的類，它是上面TD的一個類。。我假設一些語法需要考慮到這個 – leora 2012-04-09 19:40:20

-2

$(".fc-widget-content:not(.fc-other-month):parent(.fc-day-number) .fc-day-number");

來源

2012-04-09 19:37:24 Tuan

這將針對'td'，而不是'div'。 – 2012-04-09 19:38:10

['：parent']（http://api.jquery.com/parent-selector/）不能這樣工作。我認爲你的意思是'：parent'或'：has（.fc-day-number）'。無論哪種方式，這些都是不需要的，你可以做''.fc-widget-content：not（.fc-other-month）.fc-day-number'。 – 2012-04-09 19:54:56

-2

您可以使用.filter只得到divs s的正確的父：

$('.fc-day-number').filter(function(){ 
    return $(this).closest('.fc-other-month').length === 0; 
}).after(function() { 
    return "<span class='addEventHidden' style='display: none;'><img src='/Content/Images/addEvent.gif'></span>"; 
});

或者你可以使用一個更具體的選擇，選擇div。

$('.fc-widget-content:not(.fc-other-month) .fc-day-number').after(function() { 
    return "<span class='addEventHidden' style='display: none;'><img src='/Content/Images/addEvent.gif'></span>"; 
});

P.S.您在</td>之前忘記了</div>。

來源

2012-04-09 19:41:34

我沒有投票，但是檢查了「正確的父母「似乎是一個尷尬的方式來做到這一點你的第二個解決方案在選擇器中的雙/單引號不匹配 – Mathletics 2012-04-09 19:48:50

@Mathletics：第一隻是一個建議，從來沒有說過它是最好的主意。 :-P – 2012-04-09 19:50:59

什麼是最好的jQuery選擇器進行此更改？

回答

相關問題