Javascript淘汰单击绑定

时间:2015-10-06 17:45:22

标签: javascript jquery html knockout.js

我有一个javascript敲门按钮,我想在第一次点击后禁用3秒钟。

<button type="button" class="btn btn-default btn-xs" data-bind="click: editFile">
    Edit
</button>

我试过了

<button type="button" class="btn btn-default btn-xs" data-bind="click: editFile, disable:disableButton">
    Edit
</button>

然后在JavaScript上我做到了这一点。这完全禁用了按钮。

disableButton = ko.observable("true");

我也尝试过纯JavaScript,但这根本不起作用:

$(function() {
    $(".btn-default").click(function() {
        $(".btn-default").attr("disabled", "disabled");
        setTimeout(function() {
            $(".btn-default").removeAttr("disabled");      
        }, 3000);
    });
}); 

我尝试按照淘汰赛给出的例子,但我认为我没有做好:

Knockout example

有人可以帮助我成为淘汰赛和JavaScript的新人吗?

1 个答案:

答案 0 :(得分:0)

请参阅下面的代码段 -

function AppViewModel() {
    var _self = this;
    _self.disableButton = ko.observable(false);
    _self.editFile = function(){
    	_self.disableButton(true);
        setTimeout(function() {
            _self.disableButton(false);
        }, 3000);
    };
}

// Activates knockout.js
ko.applyBindings(new AppViewModel());
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.1.0/knockout-min.js"></script>
<button type="button" class="btn btn-default btn-xs" data-bind="click: editFile, disable:disableButton">
    Edit
</button>

您只需要更新observable true或false以启用/禁用“编辑”按钮。

希望这有帮助!