0

アンカーが押されたときにアンカーを無効にするのに問題があります。

HTML：

<a href='#' data-bind='click: clickActivateSpatialSearch' id='draw_polygon'>
<i class='polygon_mark'></i>
</a>
<a href='#' data-bind='click: clickActivateSpatialSearchBox' id='draw_box'>
<i class='square_mark'></i>
</a>

jQuery

    $('.square_mark').click(function () {
        if(!$(this).hasClass('active')) {
            $(this).addClass('active');
            $('.polygon_mark').off('click', disabler);
        } else {
            $(this).removeClass('active');
            $('.polygon_mark').on('click', disabler);
        }
    });
    $('.polygon_mark').click(function () {
        if(!$(this).hasClass('active')) {
            $(this).addClass('active');
            $('.square_mark').off('click', disabler);
        } else {
            $(this).removeClass('active');
            $('.square_mark').on('click', disabler);
        }
    });
});

働き：

disabler: function(event) {
    event.preventDefault();
    return false;
},

クラスを変更する機能は正常に機能していますが、これに追加したいのは、アンカー＃1が押されているときに、もう一方のアンカーが無効になり、もう一度押すと、アンカーが再び有効になるようにすることです。 、およびその逆ですが、アンカー＃2用です。

こういうことをやってみましたが、うまくいきませんし、よくわからないです。

4

2 に答える 2

3

これを行い、cssに無効化クラスを追加します。

$('.square_mark').click(function () {
        $(this).toggleClass('active');
        $('.polygon_mark').toggleClass("disabled");
});

$('.polygon_mark').click(function () {
        $(this).toggleClass('active');
        $('.square_mark').toggleClass("disabled");
});

これはトリックを行う必要があります。

.disabled {
   pointer-events: none;
   cursor: default;
}

編集： jsfiddleの例：http：//jsfiddle.net/uKCYN/

また、他のことを行うためにアクティブなクラスをチェックする必要がある場合は、次のようにコーディングできます。

$('.square_mark').click(function () {
    if(!$(this).hasClass('active'))
        $(this).addClass('active');
    else
        $(this).removeClass('active');
    $('.polygon_mark').toggleClass("disabled");
});

$('.polygon_mark').click(function () {
    if(!$(this).hasClass('active'))
        $(this).addClass('active');
    else
        $(this).removeClass('active');
    $('.square_mark').toggleClass("disabled");
});

そして、if句に追加のものを追加します。

于 2013-03-12T12:20:03.457 に答える
1

このようにハンドラー関数を変更して、再試行してください。

// handler function
function disabler(event) {
    event.preventDefault();
    console.log('item anchor clicked');
}
于 2013-03-12T12:22:05.687 に答える