如果文件已上传，则运行 jquery 函数答案

【问题标题】：Run jquery functions if file is uploaded or not如果文件已上传，则运行 jquery 函数
【发布时间】：2017-06-06 01:13:09
【问题描述】：

我正在尝试根据文件当前是否在输入中提交来更改 div 的高度。

我的输入有一个 id="upload"

到目前为止，我正在使用 .change 运行此功能：

$('#upload').change(function(){
   $('div').css("height", "1000px");
});

这在我上传文件时完美运行，但是当我删除文件时，输入再次被更改，因此 div 的高度保持不变。所以，我需要一个可逆且双向工作的解决方案。我尝试了其他几个功能来检查值以及输入的长度，但我似乎无法得到任何有效的东西。

【问题讨论】：

有文件的时候是grow，没有文件的时候是shrink吗？

标签： jquery file input height field

【解决方案1】：

根据您所说的，我认为这应该适合您。它会在更改后检查#upload 元素的值的长度，如果它不大于 0（因此为空），它会将 div 元素缩放回 50 像素（大胆假设这是它的原始大小）。

$('#upload').change(function() {
  if (jQuery(this).val().length > 0) {
    $('div').css("height", "1000px");
  } else {
    $('div').css("height", "50px");
  }
});

我把它放在了这里：https://jsfiddle.net/7b0hvo3u/

也可以先检索 div 元素的原始高度，将其存储在某处，然后使用它来代替硬编码的“50px”。这将使它看起来像这样：

var originalHeight;
$('document').ready(function() {
  originalHeight = $('div').height();
});
$('#upload').change(function() {
  if (jQuery(this).val().length > 0) {
    $('div').css("height", "1000px");
  } else {
    $('div').css("height", originalHeight);
  }
});

这个变化的小提琴在这里：https://jsfiddle.net/ywsthj2p/1/

希望这会有所帮助，如果没有：请详细说明:)

【讨论】：