代码之家  ›  专栏  ›  技术社区  ›  Brandon Hansen

JavaScript类方法不工作

  •  3
  • Brandon Hansen  · 技术社区  · 14 年前

    我有以下代码,是为移动应用程序开发的tianium框架编写的。我遇到的问题是loadPage()方法没有调用其他方法。我错过了什么?

    Titanium.UI.currentWindow.barColor = Titanium.UI.currentWindow.barColor;
    Titanium.UI.currentWindow.title = 'My Media';
    
    
    function Media()
    {
    
    this.properties = {
        currentPage : 1,
        url : 'http://localhost/past?return=json&count=20&page=',
        rowColor: '#fff',
        rowSelectedColor: '#6BBBFA',
        filter: 'filter'
    };
    
    this.table = false;
    this.wrapper = false;
    this.products = false;
    
    /*
        Allow the user to search through all of their media
    */
    this.showSearch = function()
    {
        var search = Titanium.UI.createSearchBar({
            barColor: Titanium.UI.currentWindow.barColor, 
            showCancel: false
        });
    
        search.addEventListener('change', function(e)
        {
           e.value; // search string as user types
        });
    
        search.addEventListener('return', function(e)
        {
           search.blur();
        });
    
        search.addEventListener('cancel', function(e)
        {
           search.blur();
        });
    
        return search;
    };
    
    
    /*
        Create a row in the table.  This will actually
        append the row to a pre-existing table
    */
    this.createRow = function(product)
    {
        var row = Ti.UI.createTableViewRow();
    
        var image = Ti.UI.createImageView({
            image: product.image,
            top: 5,
            left: 5,
            width:100,
            height:70,
            canScale: true
        });
    
        var video = Ti.UI.createLabel({
            color: '#000',
            font: {
                fontSize: 14,
                fontWeight: 'bold', 
                fontFamily: 'Arial'
            },
            left: 110,
            top: 2,
            height: 20,
            width: 170,
            clickName: 'video',
            text: product.name
        });
    
        var date = Ti.UI.createLabel({
            color: '#999',
            font: {
                fontSize: 13,
                fontWeight: 'normal', 
                fontFamily: 'Arial'
            },
            left: 110,
            top: 22,
            height: 20,
            width: 100,
            clickName: 'date',
            text: product.date
        });
    
        row.height = 80;
        row.className = 'mediaItem';
        row.selectedBackgroundColor = this.properties.rowSelectedColor;
        row.hasDetail = true;
        row.filter = video.text;
    
        row.add(image);
        row.add(video);
        row.add(date);
    
        // Add the row to the table
        this.addRowToTable(row);
    };
    
    
    /*
        Add the products to the table view
    */
    this.addRows = function()
    {
        var item;
        for(item in this.products)
        {
            if(item)
            {
                this.createRow(this.products[item]);
            }
        }
    
        this.showMoreButton();
    };
    
    
    /*
        If we do not already have a table, let's go ahead and build one now
    */
    this.buildTable = function()
    {
        if(!this.table)
        {
            // Build out the table
            this.table = Titanium.UI.createTableView({
                search: this.showSearch(),
                filterAttribute: this.properties.filter,
                backgroundColor: '#ffffff'
            });
    
            this.wrapperView = Titanium.UI.createView({
                backgroundColor: 'transparent'
            });
    
            this.wrapperView.add(this.table);
            Titanium.UI.currentWindow.add(this.wrapperView);
        }
    };
    
    
    /*
        Append a row to the table (if the table exists)
    */
    this.addRowToTable = function(row)
    {
        if(this.table)
        {
            this.table.appendRow(row);
        }
    };
    
    
    /*
        Allow the user to choose to show more videos
    */
    this.showMoreButton = function()
    {
        var row = Ti.UI.createTableViewRow();
        row.backgroundColor = '#6BBBFA';
        row.selectedBackgroundColor = '#666';
    
        // add custom property to identify this row
        row.isUpdateRow = true;
    
        var rowText = Ti.UI.createLabel({
            color: '#fff',
            font: {
                fontSize:16, 
                fontWeight:'bold'
            },
            text: 'Show More Videos',
            width: 'auto',
            height: 'auto'
        });
        row.className = 'updated_row';
        row.add(rowText);
    
        row.addEventListener('click', function(e){
            this.loadPage();
        });
    
        // Add the row to the table
        this.addRowToTable(row);
    };
    
    
    /*
        We don't want to load the same page 
        multiple times, so increment the page each time
    */
    this.incrementPage = function()
    {
        this.properties.currentPage = this.properties.currentPage + 1;
    };
    
    
    /*
        Let's go ahead and load a URL and parse it as JSON
        This method will automatically paginate
    */
    this.loadPage = function()
    {
        xhr = Titanium.Network.createHTTPClient();
        xhr.open('GET', this.properties.url + this.properties.currentPage);
    
        xhr.onload = function()
        {
            // Set the response
            var response = JSON.parse(xhr.responseText);
            this.products = response.products;
    
            // Build the table.  This method will only build it if it doesn't yet exist
            this.buildTable();
    
            // Add rows to the table
            this.addRows();
    
            // Go ahead and increment the page that we are on
            this.incrementPage();
        };
    
    
        xhr.onerror = function(e)
        {
            // If there has been an error, let the user know about it
            var a = Titanium.UI.createAlertDialog({
                title:'Error',
                message: 'There was an error with the request.  Please try again later'
            });
    
            a.show();
        };
    
        xhr.send();
    };
    
    };
    
    var media = new Media();
    media.loadPage();
    
    1 回复  |  直到 14 年前
        1
  •  4
  •   lincolnk    14 年前

    xhr.onload = function() 
    { 
        // Set the response 
        var response = JSON.parse(xhr.responseText); 
        this.products = response.products; 
    
        // Build the table.  This method will only build it if it doesn't yet exist 
        this.buildTable(); 
    
        // Add rows to the table 
        this.addRows(); 
    
        // Go ahead and increment the page that we are on 
        this.incrementPage(); 
    }; 
    

    名字 this xhr 而不是 Media 对象。这通常是通过在 指向自身的构造函数,如

    function Media()     
    {     
         var self = this;
    

    然后你就可以使用 self 媒体 来自内部的对象 xhr.onload

    xhr.onload = function() 
    { 
        // Set the response 
        var response = JSON.parse(xhr.responseText); 
        self.products = response.products; 
    
        // Build the table.  This method will only build it if it doesn't yet exist 
        self.buildTable(); 
    
        ...