javascript - HTML 输入显示不随 javascript 改变

Question

我不想用这个问题打败马，但我没有运气让两个 HTML Input 元素在选中复选框时显示。我在这里浏览了多个与此问题相关的页面，最后一个是 How To Show And Hide Input Fields Based On Radio Button Selection .这是代码

function f1() {
    var mycheck = document.getElementById("isevent").checked;
    var myevent = document.getElementById("eventname");
    var mycampaign = document.getElementById("campaign");

    if (mycheck === true) {

        myevent.style.display = 'normal';
        mycampaign.style.display = 'normal';
        alert("Myevent's visibility is " + myevent.style.display);

    } else {
        myevent.style.display = 'none';
        mycampaign.style.display = 'none';

    }
}

我可以从警报中看到复选框正在调用该函数，但显示值没有改变。这是 fiddle 页面 http://jsfiddle.net/352hjrwo/12/

我错过了什么？

Answer 1

将 normal 更改为 block ;)

function f1() {
            var mycheck = document.getElementById("isevent").checked;
            var myevent = document.getElementById("eventname");
            var mycampaign = document.getElementById("campaign");
            
            if (mycheck === true) {
              
                    myevent.style.display = 'block';
                    mycampaign.style.display = 'block';
                alert("Myevent's visibility is " + myevent.style.display);

            } else {
                    myevent.style.display = 'none';
                    mycampaign.style.display = 'none';

            }
}

<div>
<input type="checkbox" id="isevent" runat="server" class="rcorners" onclick="javascript:f1()" />&nbsp;Staffed Event?
</div>
<div>
<input type="text" id="eventname" class="rcorners input" runat="server" placeholder="Event Name" style="display:none;" maxlength="128" />
</div>
<div>
<input type="text" id="campaign" runat="server" class="rcorners input" placeholder="Campaign" maxlength="64" style="display:none;" />
</div>