show <div>取决于<input /> value </div>

Question

我正在使用flexbox（fairwaytech.com/flexbox/）作为普通下拉框的替代方案，因为我的表单上有数百种可供选择的选项。如果选择了其中一些选项，我希望无需刷新页面即可显示隐藏的DIV。

在这种情况下，flexbox确定职位名称。因此，如果用户键入“Doctor”并选择结果，则flexbox将返回代码<input type="hidden" id="fb_hidden" name="fb" value="2">，其中值2与数据库中的作业标题“Doctor”相关。

当有人选择医生时，我想要显示隐藏的div，但如果选择了不同的职位，则它会保持隐藏状态。有人可以帮帮我吗？ 这是我的代码：

<input type="hidden" id="fb_hidden" name="fb" value="2">
<div id="hide" style="display:none;">
<div>
Title
</div>
<div>
<input id="number" name="number" type="text" value="">
</div>
</div>

Answer 1

Flexbox有onSelect事件（类似于html select change事件）。尝试：

$('#FLEXBOX_ID').flexbox(data, {
    onSelect: function() {
        if(this.value==="Doctor"){
             $("#DIV_ID").show();
        }else{
             $("#DIV_ID").hide();
        }
    }
});