0

次のコードは、Google-Caja プレイグラウンドからのもので、2 つのボックスを示しています。そして、他のボックスの内側にドラッグすると、囲んでいるボックスの色が変わります:

<style>
  #draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
  #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
 <script>
  $(function() {
    $( "#draggable" ).draggable();
    $( "#droppable" ).droppable({
      drop: function( event, ui ) {
        $( this )
          .addClass( "ui-state-highlight" )
          .find( "p" )
            .html( "Dropped!" );
      }
    });
  });
  </script>
4

3 に答える 3

4

はい、少し作業が必要です。find、addClass、および html は簡単​​ですが、ドラッグ アンド ドロップは別の話です。ここにチュートリアルがありますhttp://luke.breuer.com/tutorial/javascript-drag-and-drop-tutorial.aspx

于 2012-04-27T16:12:38.313 に答える
1

はい。どんな JavaScript ライブラリ コードも純粋な JS に完全に変換できます。

于 2012-04-27T16:12:23.167 に答える
1

可能ですが、.draggable() および .droppable() 関数は複雑すぎて、ここでその方法を説明できません。縮小されていない jQuery UI を見てください。これで良いスタートが切れます (ただし、まだ jQuery を使用しています)。

于 2012-04-27T16:14:26.463 に答える