jquery在循環中向上/向下移動

我正在嘗試將div中的元素向上/向下移動。一旦它移動item.position必須與前一個交換。以下是代碼。有人可以請建議如何通過新分配的位置和相關數據序列到一個數組，使他們能夠傳遞給控制器，並插入到數據庫jquery在循環中向上/向下移動

<c:forEach var="item" items="${entry.value }" > 

<ul> 
<li> <div class="rows"> 
      <a id='${item.position}' data-seq='${attr.id}' class="noDownloadFormat" href="/files/${item.value}" target="_blank"><c:out value="${item.title}" /></a> 
     <div style="float:right;margin-top:-15px;"> 
      <input type="button" class="btn" value="UP" /> 

      </div> 
     </div> 
</li> 
<ul> 
    </c:forEach>

的Jquery：

$(document).ready(function() { 

    $(".btn1").click(function(){ 
var $current = $(this).closest('li') 
var currentval =$(this).closest('li').children().find("a").prop("id"); 
var prevVal=$current.prev('li').children().find("a").prop("id"); 

    var $previous = $current.prev('li'); 
     if($previous.length !== 0){ 
     $current.insertBefore($previous); 
    $(this).closest('li').children().find("a").prop("id",prevVal); 
    $current.prev('li').children().find("a").prop("id")==currentval ; 
    } 
     return false; 
    }); 



    });

感謝

我修改了jquery，現在我可以上下移動但不能交換位置

來源

2015-04-06 user1762730

我認爲最好是交換元素「屬性」而不是替換元素...... – Madhu 2015-04-06 03:41:22

I剛剛完成按鈕... Tweak it online。

<html> 
<body> 
<ul> 
    <li> 
     <div class="rows"> 
      <a id='position1' data-seq='id1' class="noDownloadFormat" href="#" target="_blank">title1</a> 
      <div style="float:right;margin-top:-15px;"> 
       <input type="button" class="btn" value="UP 1"> 
      </div> 
     </div> 
    </li> 
    <li> 
     <div class="rows"> 
      <a id='position2' data-seq='id2' class="noDownloadFormat" href="#" target="_blank">title2</a> 
      <div style="float:right;margin-top:-15px;"> 
       <input type="button" class="btn" value="UP 2"> 
      </div> 
     </div> 
    </li> 
    <li> 
     <div class="rows"> 
      <a id='position3' data-seq='id3' class="noDownloadFormat" href="#" target="_blank">title3</a> 
      <div style="float:right;margin-top:-15px;"> 
       <input type="button" class="btn" value="UP 3"> 
      </div> 
     </div> 
    </li> 
</ul> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script> 
    var handler = function (e) { 
     $li = $(e.target).parent().parent().parent(); 
     // Avoid delete element if it's at top of list. 
     if ($li.prev().size() !== 0) { 
      // Move element. 
      $li.prev().before($li.remove()); 
      // Bind click handler to new button. 
      $('.btn', $($li)).click(handler); 
     } 
    }; 
    $('.btn').on('click', handler); 
</script> 
</body> 
</html>

來源

2015-04-06 12:10:26

回答

相關問題