jQuery

Question

如何在启用和禁用 onClick 按钮之间切换选择框...

场景：如果我点击 #locked div，这个 div 应该与另一个 class “icon-unclocked” 切换并且应该启用选择框。如果我再次点击“#locked”，选择框应该被禁用并且“icon-unclocked”必须被删除。

第一部分 (toggleClass) 运行良好..但在启用/禁用选择框时遇到问题...

FIDDLE

请检查下面的代码...

HTML:

<div class="icon-locked" id="locked">&nbsp;</div>
<select class="form-control" id="signontype" disabled>
  <option>Option 01</option>
  <option>Option 02</option>
</select>

jQuery:

$(document).ready(function(){
    $( "#locked" ).click(function() {
      $( this ).toggleClass( "icon-unlocked" );
      $('select#signontype').prop('disabled', false);
    });
});

Answer 1

试试这个：

$("#locked").click(function () {
    $(this).toggleClass("pulse-icon-unlocked");
    $('select#signontype').prop('disabled', !$(this).hasClass("pulse-icon-unlocked"));
});

您可以检查 #locked 是否有 class pulse-icon-unlocked

演示：http://jsfiddle.net/tusharj/thhxcmso/4/

Answer 2

您只需要检查您锁定的 div 是否包含 pulse-icon-unlocked class 和 .hasClass()

$( "#locked" ).click(function() {
    $( this ).toggleClass( "pulse-icon-unlocked" );
    $('select#signontype').prop('disabled', !$(this).hasClass("pulse-icon-unlocked"));
});

Fiddle Example

Answer 3

您可以使用

$('select#signontype').is(':enabled')

检查选择框是否启用。基于它你可以做你想做的事。

Fiddle

Answer 4

$("YourElementID").selectbox('disable') 将禁用选择器选择框。

注意：这适用于 选择框版本 0.2。我不确定最新版本。

jQuery - 启用禁用（切换）选择框 onClick 按钮

jQuery - Enable Disable (Toggle) Selectbox onClick Button

jquery-selectbox

Fiddle Example