js関数を使用して、ドラッグアンドドロップに関するインターネットのチュートリアルに従いました。
function dragUser(user, event) {
event.dataTransfer.setData('User', user.id);
}
function dropUser(target, event) {
var user = event.dataTransfer.getData('User');
target.appendChild(document.getElementById(user));
}
そして、これに変更したdiv/id/elements:
<div id="unassigned" ondrop="dropUser(this, event)" ondragenter="return false" ondragover="return false">
Names:
<a draggable="true" class="user" id="banana" ondragstart="dragUser(this, event)">Banana</a>
<a draggable="true" class="user" id="newyork" ondragstart="dragUser(this, event)">New York</a>
<a draggable="true" class="user" id="london" ondragstart="dragUser(this, event)">London</a>
<a draggable="true" class="user" id="ant" ondragstart="dragUser(this, event)">Ant</a>
<a draggable="true" class="user" id="melon" ondragstart="dragUser(this, event)">Melon</a>
<a draggable="true" class="user" id="cow" ondragstart="dragUser(this, event)">Cow</a>
</div>
<div id="fruit" ondrop="dropUser(this, event)" ondragenter="return false" ondragover="return false">
Fruit
</div>
<div id="animal" ondrop="dropUser(this, event)" ondragenter="return false" ondragover="return false">
Animal
</div>
<div id="city" ondrop="dropUser(this, event)" ondragenter="return false" ondragover="return false">
City
</div>
デモをライブするには、ここで jsfiddle を使用します --> http://jsfiddle.net/skinnytotoro/njdyJ/1/
ここで、並べ替え/ドラッグ アンド ドロップの一致が正しい場合 (名前が正しいカテゴリに属している場合など) にアラートを追加したいと考えています。箱)
または、1 つまたはいくつかの名前が間違ったカテゴリに属している場合、 「ほぼ正しいです。試してみてください!」のようなテキスト警告を示すアラートもあります。
そして問題は..それを作るために追加しなければならないコードまたはjs関数は何ですか? (アラートのようなもの)