0

動的に追加された項目をクリックすると、css クラスを変更しようとしています。doStuffWithThisItem メソッドにアイテムがありますが、変更が dom ツリーに保存されないようです。しかし、私はそれを機能させることができません。私が間違っていることを見つけることができますか？

        <style type="text/css">
        .selectedItem {
            background-color: red;
        }
    </style>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js" type="text/javascript"></script>
    <script type="text/javascript">

        jQuery(document).ready(function () {

            function doStuffWithThisItem(item) {
                alert(item.id);
                jQuery(item.id).addClass('selectedItem');
            }

            function parseNodes(nodes, level) {

                var ol = document.createElement("ul");
                for (var i = 0; i < nodes.length; i++) {
                    ol.appendChild(parseChildNode(nodes[i], level));
                }

                return ol;
            }

            function parseChildNode(child, level) {

                var li = document.createElement('li');
                jQuery(li).html(child.title)
                    .attr("id", child.id)
                    .click(function () {

                        if (level == 1) {
                            doStuffWithThisItem(this);
                        }

                    });

                return li;
            }

            window.jsonData = [{
                    "title": "Item 1",
                    "id": "item1",
                    "description": "Item 1 description"
                },
                {
                    "title": "Item 2",
                    "id": "item2",
                    "description": "item 2 description"
                }];

            jQuery("#someDiv").html(parseNodes(jsonData, 1));
        });

    </script>


<div id="someDiv"></div>
4

5 に答える 5

2

変更してください ：

jQuery(item.id).addClass('selectedItem');

に：

jQuery("#"+item.id).addClass('selectedItem');

セレクターを間違えた

于 2012-12-03T18:02:14.597 に答える
1

あなたはすでに html 要素を持っているので、適切に行っていなかった でdoStuffWithThisItemそれを取得する必要はありません。id

これを試して：

function doStuffWithThisItem(item) {
     alert(item.id);
     jQuery(item).addClass('selectedItem');
}
于 2012-12-03T18:00:35.197 に答える
0 
jQuery(item.id).addClass('selectedItem');

察するに

jQuery('#' + item.id).addClass('selectedItem'); //  OR   jQuery(item)

# IDセレクターがありません。

フィドルをチェック

于 2012-12-03T18:04:11.947 に答える
0

.on および .live ハンドラを試しましたか:

jQuery(li).html(child.title)
                .attr("id", child.id)
                .on('click',function () {

                    if (level == 1) {
                        doStuffWithThisItem(this);
                    }

                });

また

jQuery(li).html(child.title)
                .attr("id", child.id)
                .live('click',function () {

                    if (level == 1) {
                        doStuffWithThisItem(this);
                    }

                });
于 2012-12-03T18:01:09.017 に答える
0

動的に追加されるアイテムと関係があると思います。私は自分自身の前にそれに遭遇し、.on()メソッドを使用してイベントを動的に追加されたアイテムに添付する必要がありました。

また、セレクターは、ではなくitemにする必要があると思いますitem.id。

于 2012-12-03T18:01:55.350 に答える