开发者

jquery strange behaviour

开发者 https://www.devze.com 2023-03-03 06:36 出处:网络
i have below function which is being used to initialize a widget. jQuery.fn.initPortlet = function( parent_component ,header , component ){

i have below function which is being used to initialize a widget.

jQuery.fn.initPortlet = function( parent_component ,header , component ){
        v开发者_C百科ar 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);
};

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>

what it does is append a minus icon at the top left corner of the widget. i have some ajax call because of that this function get called multiple time and append a minus icon multiple times.

i am tring to re-write this function in such a way, so that how many time it's get called, append only one minus icon into header.

i tried fallowing approach but it didn't work.

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

what i am tring is remove all span with class name span.ui-icon ui-icon-minusthick and finally append a minus icon, but it's not worked for me.

any help or suggestion so that i can achieve my goal will be highly appreciated.

Thanks in advance!!!!!

Edit--

solution given below is working fine for one call, but it fails if i am calling this function again with same parameter and it should be and unfortunately i have to call this function several times...how can i do this..i tried lots of thing but it fails somewhere :(:(:(

Please suggest me some approach.

Thanks Once again....


You can use jQuery.data() to track whether it has already been added:

jQuery.fn.initPortlet = function(parent_component, header, component){
        var o = $(this[0]);
        if ( ! o.data('widgeted')) {
            //  .data('widgeted') will return NULL before it is set.
            //  So the first iteration of the function will execute
            //  this code block.
            this.addClass("ui-widget ui-widget-content ui-corner-all")
                .find(header)           
                .addClass("headertitle align_center defaultheadercolor")
                .prepend('<span class="ui-icon ui-icon-minusthick"></span>')
                .end()
                .find(component);
        }
        //  We set widgeted to true.  Any further calls to this function
        //  (on this DOM node) will not execute the code block above.
        o.data('widgeted', true);
};
0

精彩评论

暂无评论...
验证码 换一张
取 消