传递给方法的Javascript对象是一个字符串

时间:2013-03-14 13:09:24

标签: javascript jquery object methods

我正在使用jQuery mobile构建一个phonegap项目。

我有一个我正在迭代的javascript对象。

目前问题是:

以下是我的模型对象中的方法。它是自我递归的,一旦被调用,每次用户点击由上一级对象生成的列表项时,它将自行递归到下一级别。

我正在努力将迭代的段b作为对象传递给方法本身。由于某种原因,这将作为名为[Object]的字符串返回,而不是对象本身。

此函数在显示第一级时起作用,但是我为每个子级创建的“firstString”字符串似乎将我的对象转换为名为object的字符串。我删除了引号,将对象放在大括号中,但没有用。

有没有人知道为什么会这样,我显然遗漏了一些关于将对象传递给方法的重要信息,这些方法的调用是作为字符串生成的......

我的代码在下面,导致问题的行是firstString+="model.recurseAppTree('"+b+"');";

recurseAppTree: function(AppTree)
{
    $.each(AppTree, function(a,b)
    {
        var firstString='<li data-role="list-divider" role="heading" data-theme="b">'+b.DisplayValue+'</li>';

        if(b.Children != null)
        {
            $.each(b.Children, function(c,d)
            {
                firstString+="<li data-theme='c'><a  data-transition='slide' id='id-"+d.IdValue+"' href='javascript:void(0);'>"+d.DisplayValue+"</a></li>";
                firstString+="<script>";
                firstString+="$('#id-"+d.IdValue+"').click(function(){";
                firstString+="model.recurseAppTree('"+b+"');";
                firstString+="});";
                firstString+="</script>";
            });
        }

        $("#selectview").html(firstString);
        $("#selectview").listview('refresh', true);

    });
},

2 个答案:

答案 0 :(得分:2)

这很正常。

通过与+的串联在字符串上下文中使用对象。这告诉JS隐含地将对象强制转换为字符串。

b = {}
alert(typeof b) // object
alert(typeof (''+b)) // string

答案 1 :(得分:0)

你应该为你的gui使用事件委托

1-在您的''代码中添加(常用)类,例如unrollLink

var firstString='<li ...><a class="unrollLink" ...></a></li>"

2-在html中选择一个节点,该节点是所有“树”节点的父节点,并且将始终存在于您的html中。将click处理程序委派给此节点:

$('#selectview').on('click', '.unrollLink', function(){
    //this === clicked link - write a function which returns the node you want based on the "id" you set
    var myNode = getNode( this.id );
    model.recurseAppTree( myNode );
});

3-更改你的功能以产生足够的html。您无需为click事件添加代码:

recurseAppTree: function(AppTree)
{
    $.each(AppTree, function(a,b)
    {
        var firstString='<li data-role="list-divider" role="heading" data-theme="b">'+b.DisplayValue+'</li>';

        if(b.Children != null)
        {
            $.each(b.Children, function(c,d)
            {
                // add the class you chose to the clickable items :
                firstString+='<li data-theme="c"><a class="unrollLink" data-transition="slide" id="id-'+d.IdValue+'" href="javascript:void(0);">'+d.DisplayValue+'</a></li>';
            });
        }

        $("#selectview").html(firstString);
        $("#selectview").listview('refresh', true);

    });
},