Question

我正在使用jQuery UI为给定的html元素创建“按钮”。我正在使用Knockout.js生成html元素（foreach）。

但是，我找不到如何将参数传递给knockout.js生成项的click事件的方法。在下面的示例中，有些静态的sampleButton可以工作，但不能运行itemButton项。 http://jsfiddle.net/patware/QVeVH/

function ViewModel() {
    var self = this;

    self.ping = 'pong';

    self.items = ko.observableArray([
        { display: 'Cars', id: 1 },
        { display: 'Fruits', id: 2 },
        { display: 'Humans', id: 3 },
        { display: 'Software', id: 4 },
        { display: 'Movies', id: 5 },
    ]);
}

ko.applyBindings(new ViewModel());

$("#sampleButton").button().data('someData',101);
$("#sampleButton").click(function(e){
    alert('clicked sample: [' + $(this).data('someData') + ']');
});

$(".itemButton").button().data('someData',$(this).id);

$(".itemButton").click(function(){
    alert('clicked item: [' + $(this).attr('foo') + ']');
});

ping-<span data-bind="text: ping"></span>

<div id="sample">
<div id="sampleButton">
    <h3>Sample Button</h3>
    <a href="#">Click here too</a>
</div>
</div>

<div data-bind="foreach: items">
<div class="itemButton" data-bind="foo: id">
    <h3 data-bind="text:display"></h3>
    <a href="#" data-bind="text:display"></a>
</div>
</div>

Answer 1

考虑使用ko.dataFor而不是使用jquery应用数据。根据您的示例http://jsfiddle.net/QVeVH/6/

运行示例

Answer 2

您可以使用自定义绑定设置所有内容。

http://jsfiddle.net/jearles/QVeVH/7/

knockout.js，jquery-ui，按钮点击和参数

2 个答案: