排序輸入聯繫人字段

-1

我只需要讓用戶訴諸領域的項目，所以用戶可以更改順序，這個領域是第一，這是秒&第三& ....排序輸入聯繫人字段

<div class="f-row instruction"> 
    <div class="full"> 
     <input type="text" placeholder="Instructions 1" /> 
     <input type="text" placeholder="Instructions 2" /> 
     <input type="text" placeholder="Instructions 3" /> 
     <input type="text" placeholder="Instructions 4" /> 
    </div> 
    <button class="remove">-</button> 
</div>

感謝&順祝商祺

來源

2014-09-28 Mirr0rs

您嘗試過什麼嗎？ – artm 2014-09-28 13:12:04

[可排序]（http://jqueryui.com/sortable/） – 2014-09-28 13:12:25

[HTML5佔位符屬性不能代替標籤元素]（http://www.456bereastreet.com/archive/201204/the_html5_placeholder_attribute_is_not_a_substitute_for_the_label_element/） – Quentin 2014-09-28 13:57:07

我看你有沒有這個煩惱，所謂

示例 - 如何使用jQueryUI的排序：

首先，不要忘了，包括jQuery和jQueryUI的（HTML5 - 在頁面的結尾）：

<script src="//code.jquery.com/jquery-1.10.2.js"></script> 
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>

，我們有我們的HTML，我們需要環繞李的投入，我們不能拖動這些輸入，因爲它們是可點擊的，我們不想失去它們的功能。因此，我們將使用一個外部框架：

<div class="f-row instruction"> 
    <ul class="full"> 
     <li><input type="text" placeholder="Instructions 1" /></li> 
     <li><input type="text" placeholder="Instructions 2" /></li> 
     <li><input type="text" placeholder="Instructions 3" /></li> 
     <li><input type="text" placeholder="Instructions 4" /></li> 
    </ul> 
    <button class="remove">-</button> 
</div>

和我們的JS：

<script> 
    $(function() { 
     $(".full").sortable(); 
     $(".full").disableSelection(); 
    }); 
    </script>

就是這樣，I'ts不是很複雜。工作示例 -

http://jsfiddle.net/1Lvc5hwf/2/

來源

2014-09-28 15:06:23 Artipixel

排序輸入聯繫人字段

回答

相關問題