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

【问题标题】：Javascript Object Passed Into Method Is A String传递给方法的 Javascript 对象是一个字符串
【发布时间】：2013-03-02 20:33:38
【问题描述】：

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

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

目前的问题是这样的：

下面是我的模型对象中的一个方法。它是自递归的，一旦被调用，每次用户点击上一层对象生成的列表项时，都会通过自身递归到下一层。

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

这个函数在显示第一级时确实有效，但我为每个孩子创建的“firstString”字符串似乎正在将我的对象变成一个名为对象的字符串。我已删除引号，将对象放在大括号中，但无济于事。

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

我的代码在下面，导致问题的行是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);

    });
},

【问题讨论】：

标签： javascript jquery object methods

【解决方案1】：

这很正常。

您通过与+ 的连接在字符串上下文中使用对象。这告诉 JS 隐式地将对象转换为字符串。

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

【讨论】：

【解决方案2】：

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

1- 在你的 '' 标签中添加一个（通用）类，例如unrollLink：

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

2- 在您的 html 中选择一个节点，它是您所有“树”节点的父节点，并且将始终存在于您的 html 中。将点击处理程序委托给该节点：

$('#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);

    });
},

【讨论】：