Javascript 在knockoutjs中向select添加双向值
我需要帮助 我有两个选择框,我想能够改变一个选择值,另一个将被计算和选择 问题是,当我从一个选择框中选择一个值时,第二个选择框中不存在计算,例如,如果我将风险金额设置为700,则投资金额应为1400,它将不会显示在投资金额选择框中 我要做的是在选择框中显示它,而不是将其添加为选项 顺便说一下,select应该双向工作 请帮忙 HTMLJavascript 在knockoutjs中向select添加双向值,javascript,knockout.js,Javascript,Knockout.js,我需要帮助 我有两个选择框,我想能够改变一个选择值,另一个将被计算和选择 问题是,当我从一个选择框中选择一个值时,第二个选择框中不存在计算,例如,如果我将风险金额设置为700,则投资金额应为1400,它将不会显示在投资金额选择框中 我要做的是在选择框中显示它,而不是将其添加为选项 顺便说一下,select应该双向工作 请帮忙 HTML Invest Amount: <select style="width:70px;height:22px;" data-bind="options: Av
Invest Amount:
<select style="width:70px;height:22px;" data-bind="options: AvailableInvestAmount,
optionsText: function(item) {
return '$' + item;
},
value: InvestAmount"></select>
<span data-bind="text: InvestAmount"></span>
<br />
<br />
Risk Amount:
<select style="width:70px;height:22px;" data-bind="options: AvailableRiskAmount,
optionsText: function(item) {
return '$' + item;
},
value: RiskAmount"></select>
<span data-bind="text: RiskAmount"></span>
因此,它似乎工作正常,但当它计算时,它试图找到一个在另一个列表中不存在的值(x/2)。因此,您可以看到您的示例适用于1000
这样的值,其中500
存在于另一个列表中
一般来说,自动更新两者是个坏主意——它通常会以无休止的循环结束。相反,您可能需要考虑在单击时执行这些计算。请查看[awesome]教程,了解更多信息
此外,我上面的提琴还展示了如何实现viewModel。虽然您的方法可能有效,但如果您的实现更接近文档的教学方式,则更容易理解。我自己还在学习KO,所以我的立场将来可能会改变。
因此,它似乎工作正常,但当它计算时,它试图找到一个在另一个列表中不存在的值(x/2)。因此,您可以看到您的示例适用于1000
这样的值,其中500
存在于另一个列表中
一般来说,自动更新两者是个坏主意——它通常会以无休止的循环结束。相反,您可能需要考虑在单击时执行这些计算。请查看[awesome]教程,了解更多信息
此外,我上面的提琴还展示了如何实现viewModel。虽然您的方法可能有效,但如果您的实现更接近文档的教学方式,则更容易理解。我自己还在学习KO,所以我的立场将来可能会改变。我设法让我使用jquery并绑定函数,而不是计算绑定
我设法使用jquery和绑定函数而不是计算绑定来工作
你实现视图模型的方式有点奇怪,我正在为你研究一种新的方式。如果你接受任何解决方案,小提琴只是概念的证明,但反映了实际的项目。我意识到这不是你以前不知道的事情,而是玩弄选项和查看文档,如果值无效,则可观察对象似乎会导致错误。你可能想把这篇文章发到论坛上,看看是否有办法检查某个值是否存在谢谢你的帮助,因为你是唯一一个试图帮助投票支持你的人你实现视图模型的方式有点奇怪,我正在为你研究一种新方法谢谢你,任何解决方案都被接受,小提琴只是一个概念的证明,但它反映了实际的项目。我意识到这不是你不知道的事情,但是通过使用这些选项和查看文档,如果值无效,那么一个可观察对象似乎会导致错误。你可能想把这篇文章发到论坛上,看看是否有办法检查某个值是否存在感谢你的帮助,因为你是唯一一个试图帮助投票支持你的人一个有趣的问题,很高兴你得到了一些有用的东西-有人能从论坛上提供帮助吗?一个有趣的问题,很高兴你得到了一些工作-有人能够从论坛上提供帮助吗?
var viewModel = {
RiskAmount: ko.observable(200)
};
viewModel.AvailableInvestAmount = ko.observableArray(['200', '400', '500', '600', '700', '800', '900', '1000', '1200', '1500', '2000', '3000', '5000']);
viewModel.AvailableRiskAmount = ko.observableArray(['200', '400', '500', '600', '700', '800', '900', '1000', '1200', '1500', '2000', '3000', '5000']);
viewModel.InvestAmount = ko.computed({
read: function () {
return this.RiskAmount() * 2;
},
write: function (value) {
this.RiskAmount(value / 2);
},
owner: viewModel
});
ko.applyBindings(viewModel);
var viewModel = {
RiskAmount: ko.observable(200)
};
viewModel.AvailableInvestAmount = ko.observableArray(['200', '200', '400', '500', '600', '700', '800', '900', '1000', '1200', '1500', '2000', '3000', '5000']);
viewModel.AvailableRiskAmount = ko.observableArray(['200', '200', '400', '500', '600', '700', '800', '900', '1000', '1200', '1500', '2000', '3000', '5000']);
viewModel.CalculateInvestAmount = function () {
var riskAmount = $('#RiskAmount').val();
var investAmount = riskAmount * 2;
$('#InvestAmount option:first').val(investAmount).text('$' + investAmount);
$('#InvestAmount').val(investAmount);
};
viewModel.CalculateRiskAmount = function () {
var investAmount = $('#InvestAmount').val();
var riskAmount = investAmount / 2;
console.log(investAmount);
console.log(riskAmount);
$('#RiskAmount option:first').val(riskAmount).text('$' + riskAmount.toFixed(0));
$('#RiskAmount').val(riskAmount.toFixed(0));
};
ko.applyBindings(viewModel);