Javascript 如何基于knockoutjs中的选择获取值

我正在使用knockout从API获取一些数据，以填充我的文本框。当你选择一种药物时，我想从API中得到单价。我该怎么做

<div class="control-group">
    <label class="control-label">Drug:</label>
    <div class="form-horizontal">
        <select id="Drug_ddl" data-bind="options: drugs, optionsText: function (item) { return item.Description; }, value: selectedDrug" class="input-xlarge"></select>
    </div>
</div>


<div class="control-group">
    <label class="control-label">Unit Price:</label>
    <div class="form-horizontal">
        <input type="number" data-bind="value: unitPrice" step="0.01" class="input-xlarge" id="UnitPrice_txt" />
    </div>
</div>

<div class="control-group">
    <label class="control-label">Quantity:</label>
    <div class="form-horizontal">
        <input type="number" data-bind="value: quantity" step="1" class="input-xlarge" id="Qty_txt" />
    </div>
</div>

<div class="control-group">
    <label class="control-label">Cost:</label>
    <div class="form-horizontal">
        <input type="text" data-bind="value: drugcost" readonly="readonly" step="0.01" class="input-xlarge" id="Cost_txt" />
        <input type="button" id="AddDrugs_btn" data-bind="click: addDrug" class="btn btn-primary" value="Add" />

    </div>
</div>

---

有人好心地给我一个代码，可以做到这一点，我是相当新的击倒，真的不知道如何去做这件事。谢谢

超级酷是对的，订阅是处理这个问题的好方法

<div class="control-group">
    <label class="control-label">Drug:</label>
    <div class="form-horizontal">
        <select id="Drug_ddl" data-bind="options: drugs, optionsText: function (item) { return item.Description; }, value: selectedDrug" class="input-xlarge"></select>
    </div>
</div>


<div class="control-group">
    <label class="control-label">Unit Price:</label>
    <div class="form-horizontal">
        <input type="number" data-bind="value: unitPrice" step="0.01" class="input-xlarge" id="UnitPrice_txt" />
    </div>
</div>

<div class="control-group">
    <label class="control-label">Quantity:</label>
    <div class="form-horizontal">
        <input type="number" data-bind="value: quantity" step="1" class="input-xlarge" id="Qty_txt" />
    </div>
</div>

<div class="control-group">
    <label class="control-label">Cost:</label>
    <div class="form-horizontal">
        <input type="text" data-bind="value: drugcost" readonly="readonly" step="0.01" class="input-xlarge" id="Cost_txt" />
        <input type="button" id="AddDrugs_btn" data-bind="click: addDrug" class="btn btn-primary" value="Add" />

    </div>
</div>

    selectedDrug.subscribe(function (newValue) {
                neededInfo(getSelectedDrugInfoFromApi(newValue));
            });

每次SelectedDrugObservable值更改时，这将调用getSelectedDrugInfoFromApi（），并更新所需的信息observable。

---

但是请记住不要在subscribe函数中更新selectedDrug值，因为它会创建一个循环

好的，在选项右侧

更改

，因此使用

订阅

对药物下拉列表的值绑定观察值（即所选药物）。内部订阅进行ajax调用并填写

untiprice

。可能没有问题包括

选项value

。欢迎发布您的视图模型code@supercool你能给我一个示例代码吗？我对knockout有点陌生，对subscribeDo Referer ko doc不太了解，这对ko的新手开发人员有很大帮助。干杯。在本例中，getSelectedDrugInfoFromApi（）将是一个函数，所需的信息是我的单价。是吗？对，是这样的：单价（getUnitPriceByDrug（newValue））；将调用getUnitPriceByDrug（），其中newValue参数等于新选择的值，并将其分配给unitPrice

<div class="control-group">
    <label class="control-label">Drug:</label>
    <div class="form-horizontal">
        <select id="Drug_ddl" data-bind="options: drugs, optionsText: function (item) { return item.Description; }, value: selectedDrug" class="input-xlarge"></select>
    </div>
</div>


<div class="control-group">
    <label class="control-label">Unit Price:</label>
    <div class="form-horizontal">
        <input type="number" data-bind="value: unitPrice" step="0.01" class="input-xlarge" id="UnitPrice_txt" />
    </div>
</div>

<div class="control-group">
    <label class="control-label">Quantity:</label>
    <div class="form-horizontal">
        <input type="number" data-bind="value: quantity" step="1" class="input-xlarge" id="Qty_txt" />
    </div>
</div>

<div class="control-group">
    <label class="control-label">Cost:</label>
    <div class="form-horizontal">
        <input type="text" data-bind="value: drugcost" readonly="readonly" step="0.01" class="input-xlarge" id="Cost_txt" />
        <input type="button" id="AddDrugs_btn" data-bind="click: addDrug" class="btn btn-primary" value="Add" />

    </div>
</div>