html input框值不一样,页面显示不一样?

图片说明
比如我在 惩罚类别 选择 警告时,奖惩期限、奖惩起日、奖惩止日不显示;在选择 禁闭时,奖惩期限、奖惩起日、奖惩止日时,就要显示;
或者页面一开始不显示奖惩期限、奖惩起日、奖惩止日这些输入框,当选择奖惩类别是禁闭时,显示奖惩期限、奖惩起日、奖惩止日这些输入框。
怎么破

//首先你先将奖惩期限、奖惩起日、奖惩止日的 visibility设置为hidden;
function check(){
var i= $(奖惩类型).val();
if(i==“禁闭时”){
//将其余三项的visibility设置为 visible
}
else{}
}
//把函数绑定到奖惩类型 用 onchang="check()"
流程就是这样

http://www.w3school.com.cn/cssref/pr_class_display.asp
http://www.w3school.com.cn/tags/event_onchange.asp