jQuery Change Div Button State & Click Disable

Код javascript jQuery ниже работает, за исключением того, что я хотел бы добавить 2 функции в состояние кнопки.jQuery Change Div Button State & Click Disable

Когда пользователь нажимает на одну из кнопок, другая кнопка, которая не была нажата, получает новый класс (смотрите).
Состояние обеих кнопок должно изменяться на unclickable.

 
[div id="1" class="__button_image"] [/div] 
[div id="2" class="__button_image"] [/div]

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

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

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

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

источник

2009-04-18 jdev

Вот окончательный код, который я пошел с:

$("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-20 21:58:31 jdev

В чем проблема? Единственное, что я могу видеть, что вы пропали без вести в

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

Это удалит «Клик» обработчик (установка его обратно по умолчанию).

источник

2009-04-18 18:38:19

Спасибо за UNBIND совет, я взял его на шаг дальше и добавил: .unbind ('щелчок'); .unbind ('mouseover'); .unbind ('mouseout'); Чтобы полностью отключить взаимодействие кнопок, пользователь нажал одну из двух кнопок. – jdev

Вы можете просто использовать .unbind() (без каких-либо параметров), чтобы отменить все связанные события. –

Я хотел бы изменить свой обработчик мыши() к этому:

$("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-19 19:17:59 scronide

Также хороший совет, я использовал removeClass ("look") в базовом классе элемента (вместо этого изменил имя класса). – jdev

Это всегда работает для меня (также изменяет непрозрачность до 80% и изменяет курсор на ожидание)

$("#buttonDivId").css({opacity: 0.8, cursor: "wait"}).prop("disabled", true);

источник

2012-11-04 22:00:04 Jonathan

Если вы используете пользовательский интерфейс JQuery, вы можете использовать метод отключения.

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

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

источник

2012-12-19 00:46:20

jQuery Change Div Button State & Click Disable

ответ

Смежные вопросы