如何在jQuery中获取draggable元素的值?

时间:2017-03-13 16:22:33

标签: asp.net-mvc-4 jquery-ui drag-and-drop draggable droppable

我正在使用jQuery来实现拖放。我想获得可拖动控件的值。

Draggable Control:
------------------

<li>@Html.Label(temp.Label, new { id = "droppable", style = "color:black; width:auto", value = temp.Key })</li>

Function to show draggable control value:
-----------------------------------------

     function initDroppable($elements) 
     {
            $elements.droppable({
                drop: function (event, ui) {
                    var tempid = ui.draggable;
                    var value = tempid.attr("value");
                    alert(value);
                }
            });
      }

尝试上面的代码,但输出是&#34;未定义&#34;。我尝试了各种似乎不起作用的东西。感谢任何帮助,谢谢!

2 个答案:

答案 0 :(得分:1)

变化:

var tempid = ui.draggable;

为:

var tempid = $(ui.draggable);

然后通过attr方法访问该值:

var value = tempid.attr("value");

答案 1 :(得分:0)

添加到@Stuart,我们是在寻找input还是label?像这样:

var tempid = $(ui.draggable).find("input");
var value = tempid.val();

我怀疑被拖动的项目是:

<li>
  <label id="droppable" style="color:black; width:auto" value="1">Temp</label>
</li>

如果您向我们展示了生成的HTML,那将会很有帮助。

另外,为什么不使用data属性?

<li>
  <label id="droppable" style="color:black; width:auto" data-temp-key="1">Temp</label>
</li>

使用:

var value = ui.draggable.data("temp-key");