0

私はこのようなhtmlを持っています:

<div id="jquery-modal" class="close" style="position: absolute; top: 0px; right: 0px; left: 0px; background-color: rgba(0, 0, 0, 0.701961); z-index: 5; height: 653px; background-position: initial initial; background-repeat: initial initial;">
    <div class="myclass" data-multiselect="0" style="height: 633px; top: 10px; display: block;"></div>
    <div class="myclass" data-multiselect="1" style="height: 633px; top: 10px; display: block;"></div>
</div>

上記の html の複数選択 1 と 0 に注意してください。現在、私の js では、複数選択に応じてトグルを適用しています。問題は、data-multiselect="1" で myclass div をクリックすると、data-multiselect=0 でその上の div が取得されることです。これを処理するように js を修正するにはどうすればよいですか。これが私のjsです：

function onClickingLi(event) {     
    var Selector = $('#jquery-modal').children('.myclass');
    var isMultiselect = Selector.data('multiselect');
    if (isMultiselect) {
         $(event.target).toggleClass('selected');
    }
    else {
        Selector.find('li.selected').removeClass('selected')
    }
}
4

1 に答える 1

3

$('#jquery-modal').children('.myclass');

2つの要素（jQueryオブジェクト）を取得します

<div class="myclass" data-multiselect="0" 
<div class="myclass" data-multiselect="1"

したがって、これを使用しようとするvar isMultiselect = Selector.data('multiselect');と、常にクラスの最初のインスタンスがフェッチされますmultiselect=0

そのため、クリック イベントがどのようにバインドされているか、特定のクラスを簡単にターゲットできるようにする方法について言及する必要があります。

于 2013-07-31T21:15:21.087 に答える