jquery - 将 LI 元素中的参数传递给 jQuery droppable

Question

我可以向 LI 元素添加一个参数，以便我可以在 jQuery 的 droppable 中检索它吗

目前我有：

drop: function(event, ui) { 
   var theText = ui.draggable.text();
}

但是我需要访问 LI 元素中的参数吗？

Answer 1

您可以在标签中添加一个data-*属性，也可以将一个属性放入其中并将参数存储在那里。liinput[type=hidden]li

Answer 2

试试这个示例程序。它可以帮助您满足您的要求

        $(document).ready(initialize);
        function initialize() 
        {
            $("#divFields li").draggable
            ({
                helper: "clone"
            });


            $("#divDroppedFields").droppable
            ({
                accept: "#divFields li",
                drop: function (event, ui)
                {
                    $(this).find('#txtMessageFields').append((ui.draggable.attr('data-value')));                        
                }
            });
        }


    <div id="divFields">
        <ul>
            <li data-value="data1">iPhone</li>
            <li data-value="data2">iPod</li>
            <li data-value="data3">iPad</li>
        </ul>
    </div>


  <div id="divDroppedFields" class="ui-widget-content">
        <textarea id="txtMessageFields" cols="50" rows="10"></textarea>
  </div>