javascript - 输入字段动态隐藏，以后无法显示

Question

我有一个带有文本输入的表单和一对用于选择是/否的单选按钮。为了保持简单，单选按钮单击事件检查值，如果是，则显示输入文本字段。如果不是，它会隐藏输入字段。我还检查文档就绪的初始状态并显示/隐藏输入文本字段。

我发现单击“否”会导致使用 jQuery .hide() 方法隐藏输入。但是当我选择"is"时，生成的 .show() 方法调用不会显示输入。如果我将单选按钮设置为"is"，然后刷新页面，那么输入就会正常显示。

Firebug 显示没有输入标记。这就像单击“无单选”会从 DOM 中删除输入。

这是 JS 代码示例:

    $(document).ready(function() {
        if ($('#cost_sharing_yes').attr('checked') == 'checked') {
            $('input#Institutional_CS_TP').show();
        } else {
            $('input#Institutional_CS_TP').hide();
        }

        $('#cost_sharing_yes').click(function() {
            $('input[id="Institutional_CS_TP"]').show();
        });
        $('#cost_sharing_no').click(function() {
            $('input#Institutional_CS_TP').fadeOut("fast");
        });
    }        

Answer 1

您缺少用于关闭就绪函数的):

$(document).ready(function() {

} // <--  

要正确获取输入的 checked 属性，您应该使用 prop 方法而不是 attr。

$(document).ready(function() {
   var isChecked = $('#cost_sharing_yes').prop('checked');
   $('#Institutional_CS_TP').toggle(isChecked);
   // ..
})