Question

我们有一个有手风琴的表格。折叠的手风琴中的一个面板有一个<input type="file">我们看到的情况是，enter将触发隐藏输入字段上的文件浏览器。

当输入位于隐藏的div上时，如何禁用文件浏览器。这是我尝试过但似乎首先触发浏览器然后运行我的东西。

        $(window).keydown(function(event){
            if(event.keyCode == 13) {
                 if ($("input[type=file]").is(":hidden")) {
                    alert("HIDDEN")
                    event.preventDefault()
                    return false
                 } else {
                    alert("NOT HIDDEN")

                 };
            }
        });

Answer 1

尝试这样的事情：

    $(window).keydown(function(event){
        if(event.keyCode == 13) {
             if ($("input[type=file]").is(":hidden")) {
                $("input[type=file]").attr("disabled","disabled");
                return false
             } else {
                $("input[type=file]").removeAttr("disabled");
             };
        }
    });

Answer 2

我不确定捕获的是否在keydown。

但是如果你需要一个条件来查看输入是否在隐藏容器中，bootstrap 3会将一个collapsed类添加到已关闭的accordion元素的标题中。所以用Jquery查找它。类似的东西：

if($("input[type=file]").parents(".panel").find(".panel-heading [data-toggle].collapsed").length > 0) {
    //Is closed
}
else {
    //Is opened
}

Answer 3

可能发生的事情是用户以某种方式选中了元素。如果是这种情况，那么解决方案很简单 - 除了禁用/启用元素外，还要设置其tabindex属性：

假设$(this)是您的文件输入元素，禁用时为：

var curTabIndex = $(this).prop('tabindex');
$(this)
    .attr('data-old-tab-index', curTabIndex)
    .prop({'disabled' : 'disabled', 'tabindex' : -1});

启用时：

$(this).prop('tabindex', -1).removeProp('disabled');

禁用带有隐藏输入的表单上的文件浏览器[type = file]

3 个答案: