0

こんにちは、ドラッグ アンド ドロップを使用するメニュー作成アプリを持っています...

**私がやりたいのは、親メニューに子を追加するときはいつでも、ドロップされた子要素「parent = Mens」に属性を追加したいということです..ie

      suppose i had dropped "Mens" as main menu and I am dropping child "Shoe" as its child


                  <ol class="ui-droppable">
                      <li><a id="1001"> Mens</a>
                              <ol class="ui-droppable">
                                    //now here i am dropping child shoe
                                    //and here i want to add an attrbute parent
                                     <li><a id="2001" parent="Mens">Shoe</a> </li>

                                 </ol>
                              </li>
                      </ol>

だから、これは私が達成したいことです

メニュー作成用のドラッグアンドドロップ可能なコードは次のとおりです

                      var i = 1;
    var z = 1;
    $(document).ready(function () {
        $("button[id='columnadd']").click(function () {
            // create the element
            var domElement = $('<div id="shoppingCart' + i++ + '" class="shoppingCart"><h2 class="ui-widget-header">Add Menu Items Here <img src="../Images/delete.png" id="shoppingCart' + z++ + '" style="float: right; cursor:pointer;" onclick="removecolumn(this.id)"/></h2><aside class="ui-widget-content" id="droppable"><ol><li class="placeholder">Add your items here</li></ol></aside></div>');
            var holder = "#columnholder";
            $("#columnholder").append(domElement);
            //$(this).after(domElement);

            // at this point we have domElement in our page

            // make it droppable
            domElement.find("ol").droppable({
                activeClass: "ui-state-default",
                accept: '.small_box li',
                greedy: true,
                drop: function (event, ui) {
                    makeItDroppableToo(event, ui, this);
                }
            });
        });
        function makeItDroppableToo(e, ui, obj) {
            $(obj).find(".placeholder").remove();
            var draggedID = ui.draggable.attr('id');
            alert(draggedID);
            //var placeholder = $("<ol><li>Add Sub Menu here</li></ol>");
            var placeholder = $("<ol><li class='submenuholder'>Drop SubMenu here</li></ol>");
            $("<li></li>").append('<a id="' + draggedID + '" draggable="true" droppable=true>' + ui.draggable.text() + '</a>').append(placeholder).appendTo($(obj));

            // this is the same as the previous one
            placeholder.droppable({
                greedy: true,
                // put options here
                drop: function (event, ui) {
                    makeItDroppableToo(event, ui, this);
                }
            });
        }
        $(".small_box li").draggable({
            appendTo: "body",
            helper: "clone"
        });
    });

ここで誰か助けてください

4

1 に答える 1

4

このように、ドロップされた子に属性を追加できます

 function makeItDroppableToo(e, ui, obj) {
     $(ui.draggable).attr("parent","MENS");
 }

このJQFAQ.comをご覧ください。jQuery 開発者にとって非常に役立ちます。

于 2012-10-31T10:26:17.590 に答える