Q&A
有難う御座います。
消したのですが同じでした。
エラー内容も
Uncaught TypeError: $(...).sortable is not a function
でした。
サンプルを参考に、表中の行をドラッグで移動する画面を作ろうとしてます。
「sortable is not a function」というエラーが出て動作しません。
ドラッグしても反応しません。
分かる方教えていただけないでしょうか？
宜しくお願い致します。
html
1<head> 2<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 3 4<link type="text/css" rel="stylesheet" 5 href="http://code.jquery.com/ui/1.10.3/themes/cupertino/jquery-ui.min.css" /> 6<style type="text/css"> 7table, th, td { border-collapse: collapse; border: solid 1px #000; } 8</style> 9<script type="text/javascript" 10 src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 11<script type="text/javascript" 12 src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script> 13<script type="text/javascript"> 14$(function() { 15 $('#test').sortable(); 16}); 17</script> 18 19</head> 20 <table id="aaa"> 21 <thead> 22 <tr> 23 <th>No.</th> 24 <th>タイトル</th> 25 </tr> 26 </thead> 27 <tbody id="test"> 28 <tr> 29 <td>1</td> 30 <td>坊っちゃん</td> 31 </tr> 32 <tr> 33 <td>2</td> 34 <td>吾輩は猫である</td> 35 </tr> 36 </tbody> 37 <talbe>
エラー内容
【追記】以下のように修正しました
html
1<head> 2 3<link type="text/css" rel="stylesheet" 4 href="http://code.jquery.com/ui/1.10.3/themes/cupertino/jquery-ui.min.css" /> 5<style type="text/css"> 6table, th, td { border-collapse: collapse; border: solid 1px #000; } 7</style> 8<script type="text/javascript" 9 src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 10<script type="text/javascript" 11 src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script> 12<script type="text/javascript"> 13$(function() { 14 $('#test').sortable(); 15}); 16</script> 17 18</head> 19 <table id="aaa"> 20 <thead> 21 <tr> 22 <th>No.</th> 23 <th>タイトル</th> 24 </tr> 25 </thead> 26 <tbody id="test"> 27 <tr> 28 <td>1</td> 29 <td>坊っちゃん</td> 30 </tr> 31 <tr> 32 <td>2</td> 33 <td>吾輩は猫である</td> 34 </tr> 35 </tbody> 36 <talbe>
回答2件
0
ベストアンサー
jquery-uiを2度呼んでますね？
最初の方を消して下さい
また同じ1系を使うにしてももう少し新しいバージョンをお勧めします
念のため
javascript
1<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 2<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 3<script> 4$(function() { 5 $('#test').sortable(); 6}); 7</script> 8<table border> 9<thead> 10<tr> 11<th>No.</th> 12<th>タイトル</th> 13</tr> 14</thead> 15<tbody id="test"> 16<tr> 17<td>1</td> 18<td>坊っちゃん</td> 19</tr> 20<tr> 21<td>2</td> 22<td>吾輩は猫である</td> 23</tr> 24</tbody> 25</table>
投稿2017/11/17 03:44
編集2017/11/17 04:10
総合スコア114775
0
下記コードを削除してください。これの後で別のjquery-ui.min.jsを呼んでいます。
HTML
1<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
投稿2017/11/17 03:42
総合スコア69400
最初のほうを消しましたか？手元環境では問題なく動作しました。
修正後ソースを追記してみては？>>pecchannさん
追記すれば良かった・・・orz
修正後のソースに置換えました。
回答が付いた質問の編集は慎重に行ってください。質問文のコードについて回答にて指摘があった場合は「追記」し、元のコードを編集する場合も「直したこと」がわかるようにしてください。
kei344様
申し訳ありません。
以後気を付けます。
元のコードと、修正後のコードを記載しました。
編集ありがとうございます。
再度手元環境（Win Firefox/Chrome）で確認しましたが、動きますね。別のファイルを見ているとかそういうことも確認してみてください。
kei344様
htmlにして動かすと動作しました。
rails上だと動作しないようです。
関係ないと思って記載してませんでいた。
申し訳ありませんでした。
有難う御座いました。
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/11/17 03:51
2017/11/17 04:11
2017/11/17 04:15
2017/11/17 04:22 編集
2017/11/17 04:21
2017/11/17 04:22