jQuery ui draggable table by single row

时间:2012-04-08 00:58:28

标签: jquery user-interface html-table draggable

我有一个可拖动的表,所有工作正常,但我希望能够从表中的<th>行拖动它,而不是从所有<td>中拖出它。

<table id="draggable">
<tr>
<th id="drag">header (can drag table from here)</th>
</tr>
<tr>
<td>normal column (can't drag the table from here)</td>
</tr>
</table>
<script type="text/javascript">
    $( "#draggable" ).draggable({ opacity: 0.5 });
</script>

我该如何处理这个?

1 个答案:

答案 0 :(得分:3)

Hiya 工作演示http://jsfiddle.net/rAzL8/ &amp; http://jsfiddle.net/rAzL8/1/

Cooleos,所以你只需要使用draggable和bingo在你的桌子上的:handle标签上使用th属性,它就会处理你桌子的th标签。希望这会有所帮助,CHeers

Jquery代码

    $( "#draggable" ).draggable({ opacity: 0.7, handle:'#drag' });

 ​

<强> HTML

<table id="draggable">
<tr>
<th id="drag">header (can drag table from here)</th>
</tr>
<tr>
    <td>normal column (can't drag the table from here) ;)</td> <td>another</td>
</tr>

    <tr>
<td>normal column (can't drag the table from here) ;) </td>
</tr>

    <tr>
<td>normal column (can't drag the table from here);) </td>
</tr>
</table>​