重复记录显示

时间:2012-02-07 06:25:57

标签: javascript jquery jquery-ui

为什么在运行代码时会显示重复内容?我在重新运行时使用empty()删除以前的记录,但它似乎也没有工作。

这是我的代码:

function listClass() {
this.formOrderList = null;
this.orderListDialogObject = $('<div id="mainDiv"></div>');
this.orderListTable = $('<div>'
    + '<table id="orderListTable" class="ui-widget tblBorder" width="100%" border="0"  cellspacing="1" cellpadding="2">'
    + '<thead class="ui-widget-header" id="orderListHead">' + '<tr>'
    + '<th><strong> Order# </strong></th>'
    + '<th><strong> Symbol </strong></th>'
    //+ '<th><strong> Exchange </strong></th>'
    //+ '<th><strong> Market </strong></th>'
    + '<th><strong> Time </strong></th>'            
    + '<th><strong> Order Type </strong></th>'
    + '<th><strong> Side </strong></th>'
    + '<th><strong> Volume </strong></th>'
    + '<th><strong> Price </strong></th>'
    + '<th><strong> Trigger Price </strong></th>'
    + '<th><strong> Filled Volume </strong></th>'
    + '<th><strong> Status </strong></th>'
    + '<th><strong> Expiry Date </strong></th>'
    + '<th><strong> Ref # </strong></th>'
    + '<th><strong> Action </strong></th>' + '</tr>' + '</thead>'
    + '<tbody id="orderListBody">' + '</tbody>' + '</table>' + '</div>');
this.orderListTabs = $('<div>' + '<ul>'
    + '<li><a href="#pendingOrderList">Pending</a></li>' + '</ul>'
    + '<div id="pendingOrderList">' + '</div>' + '</div>');
this.orderListDialogObject.appendTo("body");
this.show = function() {
$("#orderListBody", this.orderListTable).empty();
this.orderListDialogObject.dialog({
    title : 'Order List',
    width : 850,
    height : 150,           
    close : function(ev, ui) {
        $(this).remove();
        return false;
        /*$(this).dialog('destroy').remove();
        return false;*/
    }
});
this.orderListTabs.tabs();
this.orderListTabs.appendTo(this.orderListDialogObject);        
$("#pendingOrderList", this.orderListTabs).append(this.orderListTable);
}

1 个答案:

答案 0 :(得分:1)

您在函数内部引用this,因此它指向全局对象。

这是一种解决方法:

var that = this;
this.show = function() {
$("#orderListBody", that.orderListTable).empty();
that.orderListDialogObject.dialog({
    title : 'Order List',
    width : 850,
    height : 150,           
    close : function(ev, ui) {
        $(this).remove();
        return false;
        /*$(this).dialog('destroy').remove();
        return false;*/
    }
});