2

jQuery モバイルを使用して 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);

    });
},
4

2 に答える 2

2

それは普通です。

との連結により、文字列コンテキストでオブジェクトを使用します+。これにより、オブジェクトを文字列に暗黙的にキャストするよう JS に指示します。

b = {}
alert(typeof b) // object
alert(typeof (''+b)) // string
于 2013-03-14T13:12:32.947 に答える
0

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);

    });
},
于 2013-03-14T13:21:06.427 に答える