Удаление элемента с веб-страницы через расширение Firefox - PullRequest
Новая
       5

Удаление элемента с веб-страницы через расширение Firefox

0 голосов
/ 11 мая 2009

Я собираюсь разработать расширение Firefox, которое добавляет кнопку рядом с полями ввода файла (тег <input type="file">), когда файл выбран.

Файл overlay.js, который содержит логику расширения, управляет событием «выбор файла» с помощью этого метода: 

var xpitest = {
    ...
    onFileChosen: function(e) {
        var fileInput = e.explicitOriginalTarget;
        if(fileInput.type=="file"){
            var parentDiv = fileInput.parentNode;
            var newButton = top.window.content.document.createElement("input");
            newButton.setAttribute("type", "button");
            newButton.setAttribute("id", "Firefox.Now_button_id");
            newButton.setAttribute("value", "my button");
            newButton.setAttribute("name", "Firefox.Now_button_name");
            parentDiv.insertBefore(newButton, fileInput);
        }
    }
    ...
}

window.addEventListener("change", function(e) {xpitest.onFileChosen(e)},false);

Моя проблема в том, что каждый раз, когда я выбираю файл, добавляется новая кнопка, см. Эту картинку:

http://img11.imageshack.us/img11/5844/sshotn.png

Если я выберу один и тот же файл более одного раза, новая кнопка не появится (это правильно).

Как мы видим, при первом вводе файла был выбран только один файл.

На втором я выбрал два разных файла, фактически были созданы две кнопки ...

На третьем я выбрал три разных файла.

Правильное поведение должно быть таким:

  • когда файл выбран, создайте my_button рядом с полем ввода
  • если my_button существует, удалите его и создайте другой (мне нужно это, потому что я должен подключить его к пользовательскому событию, которое будет что-то делать с именем файла)

Мой вопрос: как я могу правильно удалить кнопку? Обратите внимание, что HTML-код my_button не отображается в исходном коде страницы!

Спасибо

Ответы [ 2 ]

0 голосов
/ 11 мая 2009

решаемая. Я устанавливаю идентификатор для каждого следующим методом: 

onPageLoad: function(e){
    var inputNodes = top.window.content.document.getElementsByTagName("input");       
    for(var i=0; i<inputNodes.length; i++){
    if(inputNodes[i].type=="file")
         inputNodes[i].setAttribute("id",i.toString());
    } 
}

Я вызываю этот метод только при загрузке страницы: 

var appcontent = document.getElementById("appcontent");   // browser
if(appcontent)
    appcontent.addEventListener("DOMContentLoaded", xpitest.onPageLoad, true);

Затем я изменил метод onFileChosen следующим образом: 

onFileChosen: function(e) {
    var fileInput = e.explicitOriginalTarget;
    if(fileInput.type=="file"){
        var parentDiv = fileInput.parentNode;         
        var buttonId = fileInput.id + "Firefox.Now_button_id";
        var oldButton = top.window.content.document.getElementById(buttonId);
        if(oldButton!=null){
            parentDiv.removeChild(oldButton);
            this.count--;
        }
        var newButton = top.window.content.document.createElement("input");
        newButton.setAttribute("type", "button");      
        newButton.setAttribute("id", buttonId);
        newButton.setAttribute("value", "my button");
        newButton.setAttribute("name", "Firefox.Now_button_name");
        parentDiv.insertBefore(newButton, fileInput);
        this.count++;
    }
}
0 голосов
/ 11 мая 2009

Извините, если я слишком просто думаю, но не могли бы вы просто сделать это? 

var button = document.getElementById('Firefox.Now_button_id')
button.parentNode.removeChild(button)

Это то, что вы искали? Не стесняйтесь поправлять меня, если я вас неправильно понял.

...