ソート可能ではありません

私は問題があります。私はリストを並べ替えることができるようにしたいと思います。私はこのスクリプトを作成しましたが、「ソート可能」は機能しません。どうして？ソート可能ではありません

<html> 
<script type="text/javascript"> 
     var count = 1; 
     $(function(){ 
      $('#add_item').click(function(){ 
       count++; 
       $('#container').append('<li id="item_' + count +'">' + count + '° posto: '+ '<input type="text" id="item_' + count + '" name="items[]" type="text" /><input type="submit" class="del_item" value="Elimina" /><br /></li>'); 
       return false; 
      }); 
      $('form').on('click', '.del_item', function(){ 
       count--; 
       $(this).parent().remove(); 
       return false; 
      }); 
      $('#container').sortable(); 
     }); 
    </script> 


<ul id="container"> 
      <li id="item_1">1° posto: <input type="text" id="item_1" name="items[]" /> 
      <input type="submit" class="del_item" value="Elimina" /><br /></li> 
     </ul> 
     <input type="submit" name="add_item" id="add_item" value="Aggiungi" /><br /> 

</html>

お願いします。

出典

2012-03-05 Floppy88

Chromeデベロッパーでコンソールを使用していますツールやFireBugのFirefoxは、実際のエラーに関するいくつかの詳細情報を提供する必要があります –

htmlには 'form'はありません。 –

上記のコードでは、jqueryおよびjquery-uiライブラリは含まれていません。、あなたはので、あなたのページはより次のようになり、適切なコンテンツを中心に<head>と<body>タグを追加する必要があります。また

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js" type="text/javascript"></script>

：たとえば、あなたのページの<head>セクションに次のように入れ

<html> 

<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     var count = 1; 
     $(function(){ 
      $('#add_item').click(function(){ 
       count++; 
       $('#container').append('<li id="item_' + count +'">' + count + '° posto: '+ '<input type="text" id="item_' + count + '" name="items[]" type="text" /><input type="submit" class="del_item" value="Elimina" /><br /></li>'); 
       return false; 
      }); 
      $('form').on('click', '.del_item', function(){ 
       count--; 
       $(this).parent().remove(); 
       return false; 
      }); 
      $('#container').sortable(); 
     }); 
    </script> 
</head> 

<body> 
    <ul id="container"> 
     <li id="item_1">1° posto: <input type="text" id="item_1" name="items[]" /> 
     <input type="submit" class="del_item" value="Elimina" /><br /></li> 
    </ul> 
    <input type="submit" name="add_item" id="add_item" value="Aggiungi" /><br /> 
</body> 
</html>

出典

2012-03-05 15:51:14

ありがとうございました！ jquery-ui.min.jsが見つからないことを除いて、スクリプト内のすべてが正しい – Floppy88

もっと正確に言えば、jQueryUIライブラリは含まれていません。あなたのJavaScriptデバッガをチェック...

をhttp://jsfiddle.net/pratik136/8JxfK/

出典

2012-03-05 15:57:08 bPratik

あなたはjQueryとJavaScriptファイルjqueryの-UIを含めましたと仮定： http://code.google.com/apis/libraries/devguide.html#jqueryUI

だからjQueryとjQueryUI

両方が、ここでこのデモを参照してください含めます$（ 'form'）にエラーがあります（ 'クリック' ...行）

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
    $(function() { 
     $('#add_item').click(function() { 
      count = $('.del_item').length + 1; 
      $('#container').append('<li id="item_' + count + '">' + count + '° posto: ' + '<input type="text" id="item_' + count + '" name="items[]" type="text" /><input type="button" class="del_item" value="Elimina" /><br /></li>'); 
      $('.del_item').click(function() { 
       $(this).parent().remove(); 
       return false; 
      }); 
      return false; 
     }); 
     $('#container').sortable(); 
     $('#add_item').click(); 
    }); 
</script> 

<ul id="container"> 
</ul> 
<input type="button" name="add_item" id="add_item" value="Aggiungi" /><br />

出典

2012-03-05 16:09:02 Walk

ソート可能ではありません

答えて

関連する問題