<strong>在页面上导入js <br></strong><div class="codetitle"> <span><a style="CURSOR: pointer" data="15073" class="copybut" id="copybut15073" onclick="doCopy('code15073')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code15073"> <br>jquery-1.3.2.min.js<br>jquery.tablednd_0_5.js<br><font style="COLOR: #ff0000">注意：一定要先导入jquery-1.3.2.min.js 否则出错。<br></font> </div> <br><strong>·建table<br></strong><div class="codetitle"> <span><a style="CURSOR: pointer" data="6787" class="copybut" id="copybut6787" onclick="doCopy('code6787')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code6787"> <br><table id="table-1" cellspacing="0" cellpadding="2"> <br> <tr id="1"> <td>1</td> <td>One</td> <td>some text</td> </tr> <br> <tr id="2"> <td>2</td> <td>Two</td> <td>some text</td> </tr> <br> <tr id="3"> <td>3</td> <td>Three</td> <td>some text</td> </tr> <br> <tr id="4"> <td>4</td> <td>Four</td> <td>some text</td> </tr> <br> <tr id="5"> <td>5</td> <td>Five</td> <td>some text</td> </tr> <br> <tr id="6"> <td>6</td> <td>Six</td> <td>some text</td> </tr> <br> </table> <br> </div> <br><strong>·插入js代码<br></strong><div class="codetitle"> <span><a style="CURSOR: pointer" data="84761" class="copybut" id="copybut84761" onclick="doCopy('code84761')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code84761"> <br><script type="text/javascript"><BR> $(document).ready(function() {<BR> $("#table-1").tableDnD();<BR> });<BR> </script><br> </div> <br>·ok。<br><strong>·例子<br></strong><div class="codetitle"> <span><a style="CURSOR: pointer" data="24282" class="copybut" id="copybut24282" onclick="doCopy('code24282')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code24282"> <br> String path = request.getContextPath();<br> String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";<br> pageContext.setAttribute("basePath", basePath);<br>%><br><br><br> <br> <script type="text/javascript"> src="${basePath}common/js/jquery-1.3.2.min.js"></script><br> <script type="text/javascript"> src="${basePath}common/js/jquery.tablednd_0_5.js"></script><br> <style type="text/css"><BR>.aa {<BR> background: #00FF99<BR>}<br><br>.bb {<BR> background: #0066FF<BR>}<BR></style> <br><br><script type="text/javascript"><br><br> $(document).ready(function() { <BR> color();<BR> $("#table-1").tableDnD({<BR> onDrop:function(table,row){<BR> var b = $(row).children().eq(0).text();<BR> color();<BR> } <BR> }); <br><br> });<br><br> function color()<BR> {<BR> var tbody = $("table[id='table-1'] tr");<BR> tbody.each(function(index){<BR> var cc = index%2;<BR> if(0==cc)<BR> {<BR> $(this).removeClass();<BR> $(this).addClass("aa"); <BR> }<BR> else<BR> {<BR> $(this).removeClass();<BR> $(this).addClass("bb"); <BR> }<BR> });<BR> }<BR> </script><br> <br><br> <br> <table id="table-1" cellspacing="0" cellpadding="2"> <br> <tr id="1"> <td>1</td> <td>One</td> <td>some text</td> </tr> <br> <tr id="2"> <td>2</td> <td>Two</td> <td>some text</td> </tr> <br> <tr id="3"> <td>3</td> <td>Three</td> <td>some text</td> </tr> <br> <tr id="4"> <td>4</td> <td>Four</td> <td>some text</td> </tr> <br> <tr id="5"> <td>5</td> <td>Five</td> <td>some text</td> </tr> <br> <tr id="6"> <td>6</td> <td>Six</td> <td>some text</td> </tr> <br> </table> <br><br> <br><br> </div> <br>
