2014-11-03 3 views
-1

Im пытается получить работу небольшой скрипт, как Google добавить несколько файлов, но я получаю сообщение об ошибке, как:Функция не определена Javascript

ReferenceError: addFile is not defined 

им сценарий использования является:

Javascript

function addElement(parentId, elementTag, elementId, html) { 
    // Adds an element to the document 
    var p = document.getElementById(parentId); 
    var newElement = document.createElement(elementTag); 
    newElement.setAttribute('id', elementId); 
    newElement.innerHTML = html; 
    p.appendChild(newElement); 
} 

function removeElement(elementId) { 
    // Removes an element from the document 
    var element = document.getElementById(elementId); 
    element.parentNode.removeChild(element); 
} 


var fileId = 0; // used by the addFile() function to keep track of IDs 
function addFile() { 
    fileId++; // increment fileId to get a unique ID for the new element 
    var html = '<input type="file" name="uploaded_files[]" />' + 
       '<a href="" onclick="javascript:removeElement('file-' + fileId + ''); return false;">Remove</a>'; 
    addElement('files', 'p', 'file-' + fileId, html); 
} 

HTML:

<form enctype="multipart/form-data" action="" method="post"> 
    <p>Upload file(s)</p> 
    <div id="files"> 
     <p><input type="file" name="uploaded_file[]" /></p> 
    </div> 
    <p><input type="button" value="Add File" onclick="addFile();" /></p> 
</form> 

jsfiddle пример:

http://jsfiddle.net/neocastelli/qy7xfheb/

Есть ли способ узнать, почему AddFile не определен?

+1

Вы синтаксическая ошибка, что не очень удивительно, учитывая, что вы построить HTML с помощью обработчиков событий конкатенации строк в JavaScript, это происходит так легко, когда вы не следовать лучшим практикам. Обратите внимание, что консоль вашего браузера указывает именно на эту ошибку. –

ответ

1

Вы ошиблись в побеге над строками.

var html = '<input type="file" name="uploaded_files[]" /> ' + 
      '<a href="" onclick="javascript:removeElement('file-' + fileId + ''); return false;">Remove</a>'; 

Должно быть:

var html = '<input type="file" name="uploaded_files[]" /> ' + 
      '<a href="" onclick="javascript:removeElement("file-' + fileId + '"); return false;">Remove</a>'; 

Также функция не является глобальным. Вы должны сделать:

window.addFile = function() { 

See the updated Fiddle

+1

Этого недостаточно. Вы также должны поместить этот javascript в главный тег не после того, как DOM будет готов или загружен. –

+0

Привет @Andreas, спасибо за подсказку !, Теперь я вижу, что при удалении это не удаляет выбранный элементId, и он возвращает ошибку: Uncaught SyntaxError: Unexpected token} – Dario

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