在添加和刪除類時遇到奇怪的問題

Question

我有下面的函數用於初始化一個小部件。

jQuery.fn.initPortlet = function(parent_component ,header , component){ 
     var o = $(this[0]) 
     this.addClass("ui-widget ui-widget-content ui-corner-all") 
      .find(header)   
      .addClass("headertitle") 
      .addClass("align_center") 
      .addClass("defaultheadercolor") 
      .prepend('<span class="ui-icon ui-icon-minusthick"></span>') 
      .end() 
      .find(component); 
}; 

它的作用是在窗口小部件的左上角追加一個減號圖標。 我有一些ajax調用，因爲這個函數被多次調用並追加一個減號圖標多次。

我打算以這種方式重新編寫此函數，以便調用多少次，只在標題中附加一個減號圖標。
我試過休耕方法，但沒有奏效。

var $minusthick = $('span.ui-icon ui-icon-minusthick'); 
$('div.div_header').find($minusthick).remove().prepend('<span class="ui-icon ui-icon-minusthick"></span>').end(); 

什麼，我特林是刪除所有跨度類名span.ui圖標UI圖標，minusthick最後追加一個減號圖標，但它不是爲我工作。

編輯 我打電話這此功能way-對應於此

$('.div_portlet').initPortlet('.div_portlet','.div_header','.div_content') 
      $('.div_portlet_inner').initPortlet('.div_portlet_inner','.div_header_inner','.div_content_inner'); 

HTML是 -

HTML：

<div class="div_portlet" id="LINEITEM_HEADER" > 
<div class="div_header"><%=hu.getFrameURL(82,83)%> Line Item Header Information</div> 
      <div class="div_content" id="LINEITEM_HEADER_CONTENT"> 

      </div> 
</div> 

的第二個呼叫HTML將保持不變，只是課程將從變更至div_portlet_inne r，對於其他類也是如此。 我已經寫這個函數在一個js文件中。

任何幫助或建議，以便我可以實現我的目標將高度讚賞。 請大家幫幫我，我在這一點卡住了。 在此先感謝!!!!!

Answer 1

不知道使用了哪個變量o - 但我下面修改的一般要點是使用jQuery hasClass()函數檢查類是否已經被應用。

jQuery.fn.initPortlet = function(parent_component ,header , component){ 
    var o = $(this[0]) 

    if (!this.hasClass('ui-widget')) 
    { 
     this.addClass("ui-widget ui-widget-content ui-corner-all") 
     .find(header)   
     .addClass("headertitle") 
     .addClass("align_center") 
     .addClass("defaultheadercolor") 
     .prepend('<span class="ui-icon ui-icon-minusthick"></span>') 
     .end() 
     .find(component); 
    } 
}; 

Answer 2

ʞɔɐɯɹoↃɔWsǝɯɐs給了一個很好的解決了這個問題，但這裏是一個解釋，爲什麼你的企圖沒有工作：

選擇'span.ui-icon ui-icon-minusthick'的第一部分是尋找一個span與ui-icon類，如你所願，但第二部分尋找<ui-icon-minusthick>這種顯然不存在的元素。要選擇多個類名的元素，他們都加入到同一個選擇，就像你在CSS會：

$('span.ui-icon.ui-icon-minusthick') 

當然，你代碼的其餘部分將是一個空操作，因爲find($minusthick)將什麼也不做，因此jQuery鏈的其餘部分將沒有上下文來操作。這將（我認爲）的工作如你預期：

$('div.div_header').find('span.ui-icon.ui-icon-minusthick').remove().end().prepend('<span class="ui-icon ui-icon-minusthick"></span>'); 

額外end()調用返回jQuery對象的第一選擇，在這種情況下div.div_header並沒有必要進行最後end()。