如何使用jquery-ui拖动红色div中的蓝色表单

Question

这是我的代码：

<div id="test" style="width:200px;height:100px;background:red" class="tabs change_font_size">
      <div>
          <a class="delete" style="float:right;font-size:20px;text-decoration:underline;cursor:pointer;">delete</a>
          <form action="/" style="background:blue">
              <input type="text" name="text"/>
              <input type="submit" value="submit"/>
          </form>
      </div>
  </div>

$('#test').draggable()

您可以在此 http://jsfiddle.net/8vntr/1/< 中运行此代码/a>

我可以拖动红色 div，但无法拖动蓝色表单，

我该怎么办？

谢谢

Answer 1

将表单标签放在可拖动 div 之外似乎可行。

<form action="/">
<div id="test" style="width:200px;height:100px;background:red" class="tabs change_font_size">
      <div>
          <a class="delete" style="float:right;font-size:20px;text-decoration:underline;cursor:pointer;">delete</a>
          <div>
              <input type="text" name="text"/>
              <input type="submit" value="submit"/>
          </div>
      </div>
  </div>
</form>

Answer 2

将表单高度和宽度设置为 0 ：

           <form action="/" style="background:blue,width:0;height:0;">
            <input type="text" name="text"/>
            <input type="submit" value="submit"/>
        </form>