2

私が取り組んでいるjqueryアプリケーションがあり、ユーザーが基本的にアイテムをクリックすると、そのアイテムがequippedセクションに移動します。

私がこの作業を計画していた方法は、クラスがクリックされると、jqueryがの値を持つ最初の子divを探し、それに値をからequippable割り当てることでした。#weaponsdata-item0equippable

何が起こっているのかをよりよく理解するために、ここにjsfiddleがあります。

私はもともとそれぞれの機能を使うつもりでしたが、それは両方の利用可能な機器スロットを置き換えるでしょう。最初に利用可能なスロットを見つけることができる必要があります。利用可能なスロットがない場合は、アラートを送信してください。最初に利用可能なスロットを見つける方法がわかりません。

提案？

4

4 に答える 4

1

このような意味ですか？（最初に利用可能なテキストプロパティに警告しています）

必要なセレクターは次のとおりです。

$('#weapons [data-item=0]:first')

したがって、データプロパティを設定するには、次のようにします。

$(document).ready(function(){
    $(".equippable").click(function() {
        $('#weapons [data-item=0]:first').data("item", $(this).data("item"));
    }); 
});

</ p>

于 2012-05-31T18:12:27.543 に答える
1 
$(document).ready(function() {
    $(".equippable").click(function() {
        $('#weapons')
              .find('div[data-item="0"]:first') // first div with data-item=0
              .attr('data-item', $(this).data('item')); // chage data-item value
    });
});

デモ

あなたもすることができます

$(document).ready(function() {
    $(".equippable").click(function() {
        $('div[data-item="0"]:first', '#weapons')  // first div with data-item=0
           .attr('data-item', $(this).data('item'))
    });
});

デモ

于 2012-05-31T18:15:07.517 に答える
1

これを達成する最も簡単な方法は、武器スロットに追加のクラスを使用することだと思います。

<div id="weapons">
    <div class="weapon_slot empty">No Equip</div>
    <div class="weapon_slot empty">No Equip</div>
</div>

次に、最初にコードを空にします。

$(document).ready(function(){
    $(".equippable").click(function() {
        var empty_slots = $('#weapons div.weapon_slot.empty'),
            first_empty = $(empty_slots).filter(':first');

        if(first_empty.length > 0) {
            $(first_empty).removeClass('empty');
            // and whatever you also need to do here...
        }
        else { /* Place for alert here */ }
    }); 
});

私はあなたのフィドルを更新しました（これが問題である場合は申し訳ありません）、それは正常に機能します-.empty最初の要素のアイテムクラスをクリックすると消えます（したがって、そこに追加するすべてのコードは最初の空の要素で正しく実行されます）。

乾杯！

于 2012-05-31T18:23:33.433 に答える
0 
$(document).ready(function(){
    $(".equippable").click(function() {
       var $emptySlot = $('#weapons').find('.no_equipment[data-item=0]')[0]; // Get the first empty slot
        $emptySlot.find('.no_equipment[data-item=0]').append(this);
        $emptySlot.data('item') = 1;
    });
});

</ p>

于 2012-05-31T18:17:55.317 に答える