JavaScript - Обновить форму поля

Утренние парни и девушки!JavaScript - Обновить форму поля

У меня есть бланк на моем сайте, который используется для загрузки изображений. Форма работает, но Javascript не действует так, как я ожидаю. Что я хочу сделать, это когда я выбираю изображение с помощью кнопки «Обзор», чтобы обновить соседнее поле ввода с именем файла. Кто-нибудь может понять, почему это не сработает?

Вот HTML:

<div class="input-group"> 
    <span class="input-group-btn"> 
     <span class="btn btn-danger btn-file"> 
      Browse… <input type="file" name="Image" multiple=""> 
     </span> 
    </span> 
    <input type="text" class="form-control filename" readonly=""> 
</div>

И вот Javascript:

<script type="text/javascript"> 
    $(document).on('change', '.btn-file :file', function() { 
     var input = $('.filename'), 
      numFiles = input.get(0).files ? input.get(0).files.length : 1, 
      label = input.val().replace(/\\/g, '/').replace(/.*\//, ''); 
     input.trigger('fileselect', [numFiles, label]); 
    }); 
</script>

Любая помощь будет оценена.

Спасибо, Гэвин

источник

2014-11-17 Gavin5511

Вы говорите, 'вход = $ ', который является текстовым полем, но вы пытаетесь получить файлы из этого входа вместо входного файла , Вероятно, вы захотите что-то вроде '$ (this) [0] .files' – devqon

ok, и что мне нужно сделать, чтобы вывести его в текстовое поле? Я обновлю свой код выше. – Gavin5511

Использовать этот код Это поможет вам

<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
<style> 
.btnEdit{display:none;} 
</style> 
</head> 
<script type="text/javascript"> 
    $(document).on('change', '.btn-file :file', function() { 
     var fileName = $('#uploadfile').val(); 
     $('.filename').val(fileName); 
    }); 
</script> 
<div class="input-group"> 
    <span class="input-group-btn"> 
     <span class="btn btn-danger btn-file"> 
      Browse… <input id = 'uploadfile' type="file" name="Image" multiple=""> 
     </span> 
    </span> 
    <input type="text" class="form-control filename" readonly=""> 
</div>

источник

2014-11-17 10:09:31

Спасибо Ишану, что сработало отлично. Большое спасибо. – Gavin5511

Всегда приветствуются. Пожалуйста, посмотрите на это, это идеально подходит для вашего требования http://jsfiddle.net/28yy975f/ –

Я надеюсь, что это будет работать для вас.

$(document).on('change', '.btn-file :file', function(value) { 
console.log(value); 
    var input = $('.filename'), 
     numFiles = value.target.files ? value.target.files.length : 1, 
     label = value.target.files[0].name.replace(/\\/g, '/').replace(/.*\//, ''); 
    input.val(label); 
});

Я добавил значение в качестве аргумента в случае изменения, после этого используется переменная взять имя файла из элемента.

Для тестирования вы можете проверить здесь: («имя_файл») http://jsfiddle.net/u4od6b2L/

источник

2014-11-17 10:10:56

JavaScript - Обновить форму поля

ответ

Смежные вопросы