إزالة عنصر من صفحة ويب من خلال فايرفوكس التمديد

Question

أنا ذاهب إلى تطوير فايرفوكس التمديد الذي يضيف زر بجانب ملف حقول الإدخال (إن <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 موجود حذفها وإنشاء آخر (أنا تحتاج هذا نتيجة يجب توصيله إلى جهاز مخصص لهذا الحدث الذي سوف تفعل شيئا مع اسم الملف)

سؤالي هو:كيف يمكنني صحيح حذف الزر ؟ علما بأن my_button الكود لا تظهر على صفحة المصدر!

شكرا

Answer 1

حلها.أنا وضعت معرف لكل مع الطريقة التالية:

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++;
    }
}

Answer 2

عذرا إذا أنا أفكر أيضا ببساطة, ولكن لم تفعل هذا ؟

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

هل هذا ما كنت تبحث عنه ؟ لا تتردد في تصحيح لي إذا كنت أسأت فهمك.