Jquery 在选定索引更改时调用函数

如何将函数绑定到选定的索引更改，类似于将函数绑定到按钮上的单击事件

我需要它的原因是我有一个模板，它必须重复n次。此“n”是从组合框中选择的

---

在模板结构中，knockoutJS库只接受foreach属性中的list/array对象，如何使用它来实现这一点？

这可能对您有用。html看起来像：

<select id="mySelect">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="4">4</option>
</select>

<table>
    <thead>
        <tr>
            <th></th>
            <th>name</th>
            <th>price</th>
        </tr>
    </thead>
    <tbody data-bind="template: {name:'tempTemplate', foreach:  tempCollection}">
    </tbody>
</table>

1.
2.
4.
名称
价格

对于javascript：

<script type="text/javascript">
    function temp(name, price ){
        return {name: ko.observable(name),
                price: ko.observable(price)
        };
    }

    $(document).ready(function () {
        var viewModel = {
            tempCollection : ko.observableArray([{ name: "Tall Hat", price: "39.95" }]),
            addTemp: function () { this.tempCollection.push(temp("new","price")) },
            removeTemp: function (temp) { this.tempCollection.remove(temp) }

        };
        ko.applyBindings(viewModel);

        $("#mySelect").change(function() {
            var len = viewModel.tempCollection().length;
            for (var i = 0; i < len; i++) {
                viewModel.removeTemp(viewModel.tempCollection()[0]);
            }
            for (var i = 0; i < $(this).val(); i++) {
                viewModel.addTemp();
            }
        });
});
</script>

<script id="tempTemplate" type="text/html">
    <tr>
        <td><span data-bind="text: name" /></td>
        <td><span data-bind="text: price" /></td>
    </tr>
</script>

功能温度（名称、价格）{
返回{name:ko.observable（name），
价格：可观察到的ko（价格）
};
}
$（文档）.ready（函数（）{
var viewModel={
tempCollection:ko.observableArray（[{名称：“高帽子”，价格：“39.95”}]），
addTemp:function（）{this.tempCollection.push（temp（“new”，“price”））}，
removeTemp:function（temp）{this.tempCollection.remove（temp）}
};
应用绑定（视图模型）；
$（“#mySelect”）.change（函数（）{
var len=viewModel.tempCollection（）.length；
对于（变量i=0；i

现在最好的选择是使用一个范围函数，该函数接受开始和停止值，并返回一个包含这些数字的数组。一、 例如，使用库中的range函数

像这样把这个和击倒一起使用

<div data-bind="template: { name: 'myTemplate', foreach: _.range(0, 5) }">
</div>

在模板内部，您可以使用“$data”捕获当前编号，并将其用作索引

<div>Index: <span data-bind="text: $data"></span></div>
<div>My Object Prop: <span data-bind="text: viewModel.MyObjects[$data].MyProp"></span></div>

索引：
我的对象道具：

如果要像前面的示例中那样进行简单的迭代，那么应该直接迭代对象，而不是使用这种数组索引方法。然而，如果你需要做一些新奇的事情，这种技术就可以了

例如，如果需要以2为一组显示对象列表，则可以这样做

<div data-bind="foreach: _.range(0, viewModel.MyObjects().length, 2)">
  <div>
    <div data-bind="template: { name: 'myTemplate', data: viewModel.MyObjects()[$data] }"></div>
    <div data-bind="template: { name: 'myTemplate', data: viewModel.MyObjects()[$data + 1] }"></div>
  </div>
</div>

不确定knockout.js，但是组合框更改事件应该是

$（'.selector'）.change（function（）{…}）

要获得选中的值，只需执行

$（'.selector'）.val（）。如果这基本上就是你想要的，我可以提交一个更详细的答案…希望这有帮助。谢谢。。这就是我所需要的：）那么，如果你也能接受这个答案，但我很高兴我能帮助你。
<div data-bind="foreach: _.range(0, viewModel.MyObjects().length, 2)">
  <div>
    <div data-bind="template: { name: 'myTemplate', data: viewModel.MyObjects()[$data] }"></div>
    <div data-bind="template: { name: 'myTemplate', data: viewModel.MyObjects()[$data + 1] }"></div>
  </div>
</div>