Запускать jquery функции, если файл загружен или нет

Question

Я пытаюсь изменить высоту div в зависимости от того, был ли файл в настоящее время отправлен или нет во входе.

Мой входа имеет идентификатор = «загрузить»

В настоящее время я бег этой функции с помощью .Кнопки:

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

Это прекрасно работает, когда я загрузить файл, но потом, когда я удалите файл, вход снова изменяется, так что высота div остается неизменной. Итак, мне нужно решение, которое обратимо и работает в обоих направлениях. Я пробовал несколько других функций, где я проверяю значение, а также длину ввода, но я не могу получить ничего, что работает.

Answer 1

Основываясь на том, что вы говорите, я думаю, что это должно сработать для вас. Он проверяет длину значения элемента #upload после изменения, и если он не больше 0 (таким образом, он пуст), он уменьшает элемент div до 50 px (смело предполагая, что это оригинальный размер).

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

Я положил его в скрипке здесь: https://jsfiddle.net/7b0hvo3u/

Это также возможно сначала получить первоначальную высоту элемента сНа, хранить что-то, и использование, что вместо того, чтобы жестко закодированный " 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/

Надеется, что это помогает немного, если нет: просьба уточнить :)