Question

我已经使用jquery UI制作了这个简单的按钮，其中包含非常简单的点击功能：

    $('#bewerkopslaan').button({
        icons: {
            primary: 'ui-icon-disk'
        },
        disabled: true
    }).click(function() {
        alert('test');
            });

在某些时候我启用了这样的按钮：

    $('#bewerkopslaan').button("option", "disabled", false);

然后我可以点击按钮但是......没有任何反应。然后我再次点击它，它的工作原理。所以我总是要点击两次。

Answer 1

我写的正是你提到的，但代码效果很好。 Look here

Answer 2

您提供的代码将在我的测试中正确启用按钮，但是，具有禁用状态的按钮不会禁用您添加的单击事件。如果您希望真正禁用该按钮，则只有在启用按钮时才需要绑定事件，并在禁用按钮时取消绑定单击。

示例可以在这里找到：http://jsfiddle.net/WmAQJ/1/

<html>
<head>
  <script type='text/javascript' src='http://code.jquery.com/jquery-1.5.js'></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script>

  <script type='text/javascript'>
  $('#bewerkopslaan').button({
    icons: {
        primary: 'ui-icon-disk'
    },
    disabled: true
  });

  $('#enabler').click(function() {
      $('#bewerkopslaan').button("option", "disabled", false).bind("click", function() {
        alert('test');
      })
  });

  $('#disabler').click(function() {
      $('#bewerkopslaan').button("option", "disabled", true).unbind("click")
  });
  </script>
  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/themes/base/jquery-ui.css" type="text/css" media="all" /> 
  <link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" /> 
</head>
<body>
  <div id="enabler">click me to enable button</div>
  <span id="bewerkopslaan">button</span>
  <div id="disabler">click me to disable button</div>  
</body>
</html>

启用后，需要在jQuery UI按钮上单击两次

2 个答案: