2

我在我的网站的墙贴脚本上有一个输入类型文件。当表单框打开和关闭且未选择文件时，我试图隐藏输入字段。

$(".file-upload").show().click();

我尝试使用 jquery 更改事件，但是只有在选择文件时才会触发，并且我希望能够检测到空返回

$(".file-upload").show().click().change(function(){
    // this is only triggered when a file is here
    $(this).hide();
});

更新：

$(".file-upload").show().click();
$(".file-upload").change(function(){
    $(this).hide(); // only if .file-upload is empty
});

我希望当用户单击文件输入时触发它，并且当对话框打开并且他们没有选择任何内容时，我想再次隐藏文件输入框。

http://jsfiddle.net/7Ra8a/1/

4

2 回答 2

2

好的，您添加的小提琴大大澄清了您的问题。

本质上，您正在寻找的是在文件输入对话框关闭时运行的回调函数。不幸的是，没有文件上传 API 的标准浏览器实现可以帮助您。但是，基于这个特定的用例，我认为有一个解决方法。

文件上传输入上的change事件仅在值实际更改时才会运行，而不是在每次打开和关闭对话框时运行。因此，在您现在拥有的代码中，change 事件永远不会触发，因为输入的值实际上从未改变，它只是保持为空。因此，如果您移动代码以显示click按钮change处理程序的输入并进入文件输入处理程序，您可以实现您正在寻找的功能。

$('button').click(function () {
    $(".file-upload").click();
});

// if the dialog returns a file, then show the file input field
$(".file-upload").on('change', function (e) {
    if (e.target.files.length) {
        $(this).show();
    } else {
        $(this).hide();
    }
});

真的，那里的else块不应该是必要的，但我想理论上有人可以添加一个文件然后删除它（我不知道这是否是大多数浏览器支持的功能），else这里的块涵盖那个案子。

于 2014-07-03T20:28:42.530 回答
0 
 $(".file-upload").click(function (e) {
        e.preventDefault();
        $(this).fadeOut(800, function () {
            $(this).show().fadeIn();
        });
    });

$(".file-upload").on('change', function () {
    $(this).hide(); // only if .file-upload is empty
});

尝试这个 ！;)

于 2014-07-03T15:35:29.290 回答