JQuery チェスボードの実装 code_jquery

当時は何も問題がないと思っていましたが、今振り返ってみると、ちょっと面白いと思ったので、識別のためにみんなに持って行きました。

まず第一に、チェスの駒の配置を実現する必要があります。これには間違いなく div CSS の使用が必要です。

具体的なコードについては、Jquery で作成したチェスボードをご覧ください (ソースコードを表示)。

最初、私はチェスの駒の種類ごとにクラスを作成しました。実際、これは比較的愚かな行為でした。まず、この CSS コードは冗長になります。次に、リスナーをチェスの駒 div にバインドするのはさらに面倒です。チェスの駒 div であるかどうかを判断するには、クラス名の -b および -w 接尾辞に依存してチェスであるかどうかを判断する必要があります。ピース。しかし、チェスの駒の共通の属性を抽出し、クラス qizi を指定すると、両方の問題は簡単に解決できます。

コード内の前のコードは意図的に削除しませんでした。コメントされたコードで確認できます。黒と白の両方のフラグを移動可能にするには、両側にメソッドを記述する必要がありました。これは、十分に抽象化されていない結果です。

次のステップはドラッグの実装です。これについては、

パッケージのダウンロード アドレス

コンテンツのソース元: http を参照してください。 :/ /buhutuu.cn/?p=783