Question

Szenario：
我正在创建一个移动网站，用户可以使用Jquery UI可排序选项对名称列表进行排序。
并根据列表的顺序用户将在下一页获得有关它的更多信息...
列表看起来像这样：

<div id="NameContainer" class="ui-widget">
      <div id="sortable_0">John</div>
      <div id="sortable_1">Markus</div>
      <div id="sortable_2">Alex</div>
      <div id="sortable_3">Gabriel</div>    
      <div id="sortable_4">Thomas</div>
      <div id="sortable_5">Jack</div>
      <div id="sortable_6">Jessica</div>
      <div id="sortable_7">Anna</div>
</div>

div通过持续ID动态添加到网站。
如果用户单击一个按钮（这会将他引导到一个新页面），我想获取当前（在用户对列表进行排序后）该列表中的第一个元素ID。
目前我正在使用它来获取身份证：
$("#NameContainer div:first-child").attr("id"));

但我总是从第一个Div中获取已添加到列表中的ID＆＃34; sortable_0＆＃ 34 ;.如何在列表排序后设法获得最高排名？

Answer 1

你选择主要部分，然后选择它的第一个或最后一个或孩子现在它正常工作

$(document).ready(function(){
alert($('#NameContainer').find('div:first').attr("id"));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="NameContainer" class="ui-widget">
      <div id="sortable_0">John</div>
      <div id="sortable_1">Markus</div>
      <div id="sortable_2">Alex</div>
      <div id="sortable_3">Gabriel</div>    
      <div id="sortable_4">Thomas</div>
      <div id="sortable_5">Jack</div>
      <div id="sortable_6">Jessica</div>
      <div id="sortable_7">Anna</div>
</div>

Answer 2

检查一下..我希望对你有所帮助

$( function() {
    $( "#NameContainer" ).sortable({
       stop : function(event,ui){ 
         console.log($( "#NameContainer > div:first" ).attr('id')); 
       }
    }
  );
    $( "#NameContainer" ).disableSelection();
  } );

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
<div id="NameContainer" class="ui-widget">
      <div id="sortable_0">John</div>
      <div id="sortable_1">Markus</div>
      <div id="sortable_2">Alex</div>
      <div id="sortable_3">Gabriel</div>    
      <div id="sortable_4">Thomas</div>
      <div id="sortable_5">Jack</div>
      <div id="sortable_6">Jessica</div>
      <div id="sortable_7">Anna</div>
</div>

Answer 3

尝试使用serialize格式化字符串，请检查此jsfiddle希望这也有用http://jsfiddle.net/keshann/yr273kx2/1/

通过Jquery UI Sortable

3 个答案: