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-icon ui-icon-minusthick移除所有span，最后添加一个减号图标，但它对我不起作用。

修改我用这种方式调用这个函数 -

$('.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更改为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的{{1}}，如您所愿，但第二部分正在查找ui-icon类型的元素这显然不存在。要选择具有多个类名的元素，请将它们全部添加到同一个选择器中，就像在CSS中一样：

<ui-icon-minusthick>

当然，你们其余的代码都是无操作的，因为$('span.ui-icon.ui-icon-minusthick')什么也不做，因此jQuery链的其余部分没有上下文来操作。这会（我认为）按预期工作：

find($minusthick)

额外$('div.div_header').find('span.ui-icon.ui-icon-minusthick').remove().end().prepend('<span class="ui-icon ui-icon-minusthick"></span>');调用将jQuery对象返回给第一个选择器，在本例中为end()，并且不需要最终的div.div_header。

添加和删除类时面临奇怪的问题

2 个答案:

添加和删​​除类时面临奇怪的问题

2 个答案:

添加和删除类时面临奇怪的问题