淘汰赛选择电视节目

时间:2014-07-13 17:54:00

标签: javascript jquery knockout.js

我是初学者,学习淘汰赛。我正在尝试创建一个类似日间电视节目的部分。
用户可以通过输入广播选择“星期一”或“星期二”。它如何显示日内容的div。

<input name="Test" type="radio" data-bind="checked: tvshows" />Monday <input name="Test" type="radio" data-bind="checked: tvshows" />Tuesday <div data-bind="hide: ShowMondaytvshows">...</div>
<div data-bind="hide: ShowTuesdaytvshows">...</div>

如果星期一有选择showsMo​​nday
如果用户选择星期二showTuesday tv

有人能帮我一个忙吗?

1 个答案:

答案 0 :(得分:1)

你可以这样做

您的viewmodel

function test(){
    var self = this
    self.tvshows = ko.observable('monday')
    self.ShowMondaytvshows = ko.observable(true)
    self.ShowTuesdaytvshows = ko.observable(false)
    self.tvshows.subscribe(function(){
        console.log(self.tvshows())
        if(self.tvshows() == 'monday'){
            self.ShowTuesdaytvshows(false)
            self.ShowMondaytvshows(true)
        }else{
            self.ShowMondaytvshows(false)        
            self.ShowTuesdaytvshows(true)
        }
    })
}

var vm = new test()
ko.applyBindings(vm)

并查看

<input name="Test" type="radio" value="monday" data-bind="checked: tvshows" />Monday 
<input name="Test" value="tuesday" type="radio" data-bind="checked: tvshows" />Tuesday 
<div data-bind="visible: ShowMondaytvshows">Monday programms</div>
<div data-bind="visible: ShowTuesdaytvshows">tuesday programms</div> 

输入中的注意值

Demo