4

以下の JavaScript jQuery コードは機能しますが、ボタンの状態に 2 つの機能を追加したい場合を除きます。

  1. ユーザーがボタンの 1 つをクリックすると、クリックされなかったもう 1 つのボタンが新しいクラス (look) を取得します。

  2. 両方のボタンの状態がクリック不可に変わるはずです。

[div id="1" class="__button_image"] [/div]
[div id="2" class="__button_image"] [/div]
$("div.__button_image").mouseover(関数 () {
    $(this).addClass("__button_image_hover");
});

$("div.__button_image").mouseout(関数 () {
    jq(this).removeClass("__button_image_hover");
});

$("div.__button_image").click(関数 () {
    $(this).removeClass("__button_image_hover");
    $(this).addClass("__button_image_clicked");

    jQuery.get('/do/request');        
});
4

5 に答える 5

3

これが私が行った最終的なコードです:

$("div.__button_image").mouseover(function () {
    $(this).addClass("__button_image_hover");
});

$("div.__button_image").mouseout(function () {
    $(this).removeClass("__button_image_hover");
});

$("div.__button_image").click(function () {

    /** change button look to 'clicked' */
    $(this).addClass("__button_image_clicked");

    /** get the id of the current button */
    b_id = $(this).attr('id');

    /** unbind both vote buttons for *no* interaction */
    $("div.__button_image").unbind('click');
    $("div.__button_image").unbind('mouseover');
    $("div.__button_image").unbind('mouseout');

    /**
     * wire the .each function to iterate the classes 
     * so we can change the look of the one that was 
     * not clicked.
    */
    $('div.__button_image').each(function() {
      button_id = $(this).attr('id');
      if(button_id!=b_id) {
         $('#'+button_id).removeClass("__button_image");
         $('#'+button_id).addClass("__button_image_gray");  

    }
});

jQuery.get('/do/request?id='+b_id); 
$(this).parent().css('cursor', 'default');
于 2009-04-20T21:58:31.453 に答える
2

どうしたの?あなたが行方不明だと私が見ることができる唯一のものは

$("div.__button_image").unbind('click');

これにより、「クリック」ハンドラーが削除されます (デフォルトに戻されます)。

于 2009-04-18T18:38:19.423 に答える
1

click() ハンドラを次のように変更します。

$("div.__button_image").click(function () { 
    $(this).removeClass("__button_image_hover");
    $(this).addClass("__button_image_clicked");

    /*
     * Add look class to all buttons, then remove it from this one
     */
    $("div.__button_image").addClass("look");
    $(this).removeClass("look");

    /*
     * Remove click handler from all buttons
     */
    $("div.__button_image").unbind('click');

    jQuery.get('/do/request');        
});
于 2009-04-19T19:17:59.210 に答える
1

これは常に機能します(不透明度を80%に変更し、カーソルを待機に変更します)

$("#buttonDivId").css({opacity: 0.8, cursor: "wait"}).prop("disabled", true);
于 2012-11-04T22:00:04.600 に答える
0

If you are using JQuery UI you can use the disable method.

$("selector").button("disable");

http://api.jqueryui.com/button/

于 2012-12-19T00:46:20.093 に答える