2012-01-12 95 views
0

首先让我先说这个问题,说我是相当新的Javascript。jQuery的DOM对象,并通过引用

我也明白,JavaScript对象通过引用传递和基元传递值[source]。

这就是说,这里是我的问题(简化的例子):我拉,它包含了很多不同的信息JSON数据,我需要把各种不同类型的信息转化为<ul>这是在另一个<ul>这样的:

<ul class="car-tree"> 
    <li> 
    <label>Sports Cars</label> 
    <ul class="sport-cars"> 
     <li>Porsche</li> 
     <li>Mercedes</li> 
     <li>BMW</li> 
    </ul> 
    </li> 
    <li> 
    <label>Super Cars</label> 
    <ul class="super-cars"> 
     <li>Ferrari</li> 
     <li>Lamborghini</li> 
    </ul> 
    </li> 
    <li> 
    <!-- and so on... --> 
    </li> 
</ul> 

我获取了上面的列表中选择模板包含了除最内侧<li>标签的一切,我想填充它是这样的:

var CarView = function(){ 

    var buildCarTree = function(){ 

    // Gets the JSON data from somewhere 
    var jsonData = grabJsonData(); 

    // Grab the template and convert it into a jQuery object 
    var template = $(grabCarTreeTemplate()); 

    // Adds sport car data to sports cars list 
    this.addCars(template.find('.sports-cars'), jsonData.sportsCars); 

    // Adds super car data to sports cars list 
    this.addCars(template.find('.super-cars'), jsonData.superCars); 

    // Add the car tree to some container 
    $('#container-trees').append(template); 
    } 

    var addCars = function(container, carData){ 

    for(id in carData){ 
     $('<li/>', { 
     text : carData[id].text 
     }).appendTo(container); 
    } 
    } 
}; 

var view = new CarView(); 
view.buildCarTree(); 

当你这样做你会得到没有添加数据的模板,但是,如果在console.log中添加语句addCars,则可以看到要添加到container参数中的数据。

我很困惑,因为从我从源头上理解我上面提供:

...如果你更改参数本身......这不会影响被送入项目 参数。但是,如果你改变 参数的内部,将回传播......

,我会想通appendTo将改变jQuery对象的内部结构。这是怎么回事?

+0

是'grabJsonData'做出一个Ajax请求?如果是这样,你有异步问题。发布'grabJsonData'的内容,我会告诉你如何解决。 – glortho 2012-01-12 21:22:44

+0

不,这不是问题。 JSON部分并不重要,因为我可以在addCars中看到正确修改的列表,但是当我离开该功能时,列表不会反映这些修改。 – Steve 2012-01-12 21:24:33

回答

1

它看起来像你试图调用私人VAR函数,就好像他们是obj的方法。更改此,并尝试:

var CarView = function(){ 

    this.buildCarTree = function(){ 

    // Gets the JSON data from somewhere 
    var jsonData = grabJsonData(); 

    // Grab the template and convert it into a jQuery object 
    var template = $(grabCarTreeTemplate()); 

    // Adds sport car data to sports cars list 
    this.addCars(template.find('.sports-cars'), jsonData.sportsCars); 

    // Adds super car data to sports cars list 
    this.addCars(template.find('.super-cars'), jsonData.superCars); 

    // Add the car tree to some container 
    $('#container-trees').append(template); 
    } 

    this.addCars = function(container, carData){ 

    for(id in carData){ 
     $('<li/>', { 
     text : carData[id].text 
     }).appendTo(container); 
    } 
    } 
}; 

var view = new CarView(); 
view.buildCarTree(); 

编辑:请参阅本的jsfiddle的工作代码:http://jsfiddle.net/eHrH6/

+0

正确的你!现在我觉得很可笑,因为...男孩我想念结​​对编程! – Steve 2012-01-13 02:23:44