jquery分組按鈕改變外觀後點擊

我做了3個按鈕jquery移動可以說（咖啡，可樂，水）分組水平，我想他們的行爲就像當我點擊其中一個（咖啡）點擊按鈕將改變其外觀點擊狀態，我不能再次點擊它（請注意，當我禁用按鈕時，它的顏色也變爲灰色）。然後當我點擊可樂時，咖啡恢復正常，可樂變成點擊狀態。jquery分組按鈕改變外觀後點擊

<div id="ui-26"> 
<div class="ui-segment" data-role="controlgroup" data-type="horizontal" > 
    <input type="button" name="segment-coffee" id="segment-coffee" class="custom" value="coffee" /> 
    <input type="button" name="segment-cola" id="segment-cola" class="custom" value="cola" /> 
    <input type="button" name="segment-water" id="segment-water" class="custom" value="water" /> 
</div> 
</div>

我試過使用單選按鈕，但我不能指定背景圖像，所以我決定使用分組按鈕。這應該如何在jQuery上完成？提前致謝！

來源

2011-07-19 Chinchan Zu

我覺得http://jsfiddle.net/rcNfJ/2/是你在找什麼？我只是使用attr("disabled")，但你可以做任何你想要的（改變他們的CSS，操縱數據等）。

來源

2011-07-19 07:43:18 vinceh

非常感謝！你的代碼完美工作。我試圖使用它，它確實有效，但問題是點擊咖啡後，然後水，咖啡按鈕的設計沒有改變（它保持禁用），但它可以點擊。順便說一句，即時通訊使用jQuery的移動。我不知道這是一個錯誤還是什麼 –

也許你可以參考[this]（http://stackoverflow.com/questions/5875025/disable-buttons-in-jquery-mobile）爲你的第二個問題。我從來沒有使用jQuery手機，所以我不能有太多的幫助:) – vinceh

http://jqueryui.com/demos/button/#radio

我覺得這是你要搜索的內容:)

您可以使用圖標選項設置圖標他們。

編輯：這裏是另一種解決方案呢:)

$(function() { 
    $('#ui-26 > .ui-segment > input').click(function(){ 
     if($(this).is(':disabled')) return; 
     $('#ui-26 > .ui-segment > input').prop('disabled',false); 
     $(this).prop('disabled',true); 
    }); 
});

來源

2011-07-19 07:37:19 Pehmolelu

感謝您的回覆，但像我所說的。我想給他們分配一個圖像...（對於按鈕咖啡咖啡圖像）...如果我使用單選按鈕我不能分配圖像對他們，所以我用按鈕 –

嗨！感謝這一點。我試了一下，不幸的是，點擊按鈕後，按鈕一直處於禁用狀態你提到過改變圖標......你會友善地教我如何做到這一點？ –

嗨，是啊只是注意到，如果按鈕被禁用它不能啓動任何事件，這就是爲什麼它不能回頭，因爲它不能識別點擊。但關於這個圖標：$（「.selector」）.button（{圖標：{primary：'ui-icon-gear'，secondary：'ui-icon-triangle-1-s'}}）;你只是給他們上課。 – Pehmolelu

jquery分組按鈕改變外觀後點擊

回答

相關問題