Javascript 在选中复选框时隐藏/取消隐藏文件上传

标签 javascript html checkbox

由于某种原因,我的复选框无法控制我拥有的文件上传字段。谁能看出这是怎么回事吗?当我选中该框时,它什么也不做,并且我没有收到任何返回的错误?

<script type="text/javascript">
function checkBox() {
    var changeimage=document.forms["myform"]["changeimage"].checked
    if (changeimage) {
        document.forms["myform"]["picupload"].style.display='';
    } else {
        document.forms["myform"]["picupload"].style.display='none';
    }   
}
</script>
...
<input type="checkbox" name="chnageimage" id="changeimage" onclick"checkBox();" />
  <label for="changeimage"></label>
  <br />
  <label for="picupload"></label>
  Picture
  <input type="file" name="picupload" id="picupload" style="display: none;"/>
  <br />
  <img src="userpics/<?php echo $row['Photo'] ?>" /></p>

最佳答案

这样做要好得多。

像这样更改您的 HTML 复选框。在 onclick 事件

上传递被单击的 HTMLElementthis 对象
<input type="checkbox" name="chnageimage" id="changeimage" onclick="checkClick(this);" />

现在您可以像这样更改您的 JavaScript。

function checkClick(objCheckBox) {
    document.getElementById("picupload").style.display = objCheckBox.checked ? 'block' : 'none';
}

.style.display 没有有效值,取值 ''。在本例中它应该是block

关于Javascript 在选中复选框时隐藏/取消隐藏文件上传,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7058317/

相关文章:

wpf - 根据 IsChecked 更改复选框文本

javascript - 如何访问和处理嵌套对象,数组或JSON?

javascript - onClick 将箭头移动到选定的项目符号点 - 最佳方法?

javascript - 如何使用API​​结果作为对象的属性?

jquery - HTML Div 滚动到另一个 Div

html - CSS 固定大小 header : Floating Contact Info to the Right

php - 如何为从数据库中获取的文件制作下载按钮?

javascript - Facebook "Invalid redirect_uri",但 url 对我来说看起来不错

jsp - 使用 Servlets 和 JSP 从 html 表中获取选定的行

javascript - 如何在 Javascript 中选中多个复选框