jQuery实现列表上下移动而且带入数据库

WBOY
发布: 2016-06-13 12:25:22
原创
1052 人浏览过

jQuery实现列表上下移动并且带入数据库

这是页面的上下移动功能,怎么能把移动后的顺序带入数据库

下面是js代码:

<script><br />$(function(){<br />var $up = $(".up")<br />$up.click(function() {<br />var $tr = $(this).parents("tr");<br />if ($tr.index() != 0) {<br />$tr.fadeOut().fadeIn();<br />$tr.prev().before($tr);<br /> <br />}<br />});<br />var $down = $(".down");<br />var len = $down.length;<br />$down.click(function() {<br />var $tr = $(this).parents("tr");<br />if ($tr.index() != len - 1) {<br />$tr.fadeOut().fadeIn();<br />$tr.next().after($tr);<br />}<br />});<br />var $top = $(".top");<br />$top.click(function(){<br />var $tr = $(this).parents("tr");<br />$tr.fadeOut().fadeIn();<br />$(".table").prepend($tr);<br />$tr.css("color","#f60");<br />});<br />});<br /></script>

求各位大神帮帮忙,已经卡住好几天了
------解决思路----------------------

<script src=scripts/jquery-1.8.3.min.js></script><br /><table><br /><tr><td class='xh'>1</td><td class='up'>上移</td><td class='down'>下移</td></tr><br /><tr><td class='xh'>2</td><td class='up'>上移</td><td class='down'>下移</td></tr><br /><tr><td class='xh'>3</td><td class='up'>上移</td><td class='down'>下移</td></tr><br /><tr><td class='xh'>4</td><td class='up'>上移</td><td class='down'>下移</td></tr><br /><tr><td class='xh'>5</td><td class='up'>上移</td><td class='down'>下移</td></tr><br /><tr><td class='xh'>6</td><td class='up'>上移</td><td class='down'>下移</td></tr><br /></table><br /><input type=button value=确认 id=bn><br /><script language="JavaScript" type="text/javascript"><br />$(function(){<br />  $('#bn').click(function() {<br />    var r = [];<br />    $('.xh').each(function(i, t) {<br />      r.push($(this).html());<br />    });<br />    alert(r);<br />    //$.post(url, {xh:r});<br />  });<br /><br />  var $up = $(".up")<br />  $up.click(function() {<br />    var $tr = $(this).parents("tr");<br />    if ($tr.index() != 0) {<br />      $tr.fadeOut().fadeIn();<br />      $tr.prev().before($tr);<br />    }<br />  });<br />  var $down = $(".down");<br />  var len = $down.length;<br />  $down.click(function() {<br />    var $tr = $(this).parents("tr");<br />    if ($tr.index() != len - 1) {<br />      $tr.fadeOut().fadeIn();<br />      $tr.next().after($tr);<br />    }<br />  });<br />  var $top = $(".top");<br />  $top.click(function(){<br />    var $tr = $(this).parents("tr");<br />    $tr.fadeOut().fadeIn();<br />    $(".table").prepend($tr);<br />    $tr.css("color","#f60");<br />  });<br />});<br /></script>
登录后复制

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板