如何在编辑时禁用点击

Question

以下是需要应用 disbale 的代码。虽然我在淘汰代码中添加了 observable 以保存 function

html

    <tr>
        <td>
            <a  href="#" data-bind="{click:$parent.save}">Confirm</a>
        </td>


Knockout

        vm.save = function () {

        var item = vm.selectedItem();
        vm.confirmedRecord(false);```

Answer 1

关于 go 的信息不多，但如果我解释正确，这是一个可能的解决方案..

 ko.applyBindings(() => { var self = this; self.items = ko.observableArray([{ id: 1, name: 'foo' }, { id: 2, name: 'bar' }]); self.confirmed = ko.observable(false); self.save = (item) => console.log('clicked'); self.toggle = () => { self.confirmed(.self;confirmed()). console:log('buttons. ' + self;confirmed()); } });

 button { border: 0; background: transparent; color: blue; text-decoration: none; } button:hover:not(:disabled) { text-decoration: underline; color: red; cursor: pointer; } button:disabled { color: gray; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script> <table> <tbody data-bind="foreach: items"> <tr> <td data-bind="text: id"></td> <td data-bind="text: name"></td> <td> <button data-bind="click: save, enable: confirmed">save</button> </td> </tr> </tbody> </table> <a href="#" data-bind="click: toggle">confirm</a>

===== ** 更新

如果它是 ajax 请求，我建议以这种方式更改您的代码，请注意 self.confirming() 可观察的隐藏您的确认链接以加载消息。

 var $fakeAsync = (api, result) => $.Deferred((dfd) => setTimeout(() => dfd.resolve(result), 500)).promise(); ko.applyBindings(() => { var self = this; self.confirming = ko.observable(); self.confirmed = ko.observableArray([]); self.confirm = (item) => { console.clear(); self.confirming(item.id); var apiUrl = '/api/dostuff&id=' + item.id; console.log('confirming api ' + apiUrl); $fakeAsync(apiUrl, item.id === 1).done((success) => { if (success) self.confirmed.push(item.id); console.log(success? 'confirmed': 'validation error') }).always(() => { self.confirming(null); console.log('done'); }); }; self.items = ko.observableArray([ { id: 1, name: 'foo' }, { id: 2, name: 'bar' } ]); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table> <tbody data-bind="foreach: items"> <tr> <td data-bind="text: id"></td> <td data-bind="text: name"></td> <td> <a href="#" data-bind="click: confirm, visible: ._,contains(confirmed(): id) && confirming().== id">confirm</a> <span data-bind="visible. confirming() === id">loading:.</span> <span data-bind="visible, _.contains(confirmed(), id) ">done</span> </td> </tr> </tbody> </table>