排序输入联系人字段

-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

排序输入联系人字段

回答

相关问题