2015-02-25 3 views
0

Я написал следующий код, чтобы реализовать filepicker.io в моей HTML-странице, но каким-то образом я не могу этого сделать. Также консоль firebug не показывает мне никаких ошибок или предупреждений.Почему я не могу реализовать filepicker.io в своем HTML-коде?

Я называется следующий вопрос для этого:

filepicker.io -- easy implementation

Ниже приводится ссылка jsFiddle, что я говорил:

http://jsfiddle.net/krystiangw/61861wsv/

Для справки ниже код из моего HTML файл:

<!DOCTYPE html> 
<html> 
    <head> 
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.2.min.js"> 
    </script> 
    <script> 
     $(document).ready(function(){ 
      filepicker.setKey('AFJvi8ODOSrOayoCb3swoz'); 
      document.getElementById('filepickerBtn').onclick = selectFile; 

      function selectFile(){ 
      filepicker.pick(
      // picker options 
      { 
      extension: '.docx', 
      }, 
      onSuccessCallback 
      ); 
      }; 

      function onSuccessCallback(Blob){ 
      document.getElementById('postName').textContent = Blob.filename; 
      document.getElementById('postlink').textContent = Blob.url; 
      document.getElementById('results').textContent = JSON.stringify(Blob);    
      }; 
     }); 
     </script> 
    </head> 
    <body> 
     <div class="container"> 
     <h3>Filepicker example</h3> 
     <p> 
     <button id="filepickerBtn" class="btn btn-primary"> 
     Select MS-WORD file 
     </button> 
     </p> 
     <p>Filename: <span id="postName"></span></p> 
     <p>Filelink: <span id="postlink"></span></p> 
     <p>Results: <pre id="results">Upload file to see results</pre></p> 
    </div> 
    </body> 
</html> 

Пожалуйста, направляйте и корректируйте меня, где я делаю ошибку при интеграции файла filepicker.io в HTML.

Еще одна разница, которую вы наблюдаете в скрипке, и мой код, в скрипке они включили Bootstrap 3.2.0, но я не потому, что не знаю, как включить в свой HTML. Это единственное различие.

Спасибо. Жду ваших драгоценных ответов.

+0

попробовать этот плагин? http://malsup.com/jquery/form/#file-upload –

+0

@FrebinFrancis: Я не хочу выбирать файл из своей локальной системы. Я только хочу интегрировать filepicker.io в свой HTML-код. –

+0

В чем проблема, с которой вы сталкиваетесь? Я не вижу здесь никакой проблемы ... –

ответ

2

Вы не включили bootstrap css, но это не делает различий, кроме UI. еще одно отличие я вижу, вы не включены filepicker.js

ваш поджигатель консоль должна показывать ошибку, говоря filepicker неопределен

просто добавить этот скрипт в вашей голове, и вы сделанный.

<script src="http://api.filepicker.io/v1/filepicker.js"></script> 

Проверить это fiddle

+1

Привет, спасибо. Теперь он работает отлично и идеально. –

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