[jQueryUI] 드래그 드랍 정렬요소 제한하기

Front-End/jQueryUI

[jQueryUI] 드래그 드랍 정렬요소 제한하기 - sortable()[items, cancel]

리딩리드 2017. 1. 12. 15:43

드래그 드랍 정렬요소 제한하기 - sortable()[items, cancel]

1. 매개변수 items vs cancel

- items : 해당 요소의 드래그 드롭이 불가능하다

- cancel : 드래그만 할 수 없다

2. 예

<!DOCTYPE html> <head> <meta charset="UTF-8"> <title>Title</title> <style> .helper{ border : 2px dotted red; } </style> </head> <table border="1px solid"> <thead> <th>No.</th><th>List</th> </thead> <tbody id="list"> <tr id="1"> <th>1</th><th>English</th> </tr> <tr id="2"> <th>2</th><th>Math</th> </tr> <tr id="3"> <th>3</th><th>Art</th> </tr> <tr id="4" class="nosort"> <th>4</th><th>HR</th> </tr> </tbody> </table> <div id="result"></div> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script> <script> $(function(){ $('#list').sortable({ // items: '> tr:not(.nosort)' cancel: '.nosort' }); }); </script>