0

<input type="file">ファイルが選択されたときにファイル入力フィールド (タグ)の横にボタンを追加する Firefox 拡張機能を開発します。

拡張機能のロジックを含むファイル 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

同じファイルを複数回選択しても、新しいボタンは表示されません (これは正しいです)。

ご覧のとおり、最初のファイル入力では、1 つのファイルのみが選択されています。

2 番目のファイルでは、2 つの異なるファイルを選択しました。実際には、2 つのボタンが作成されています...

3 番目に、3 つの異なるファイルを選択しました。

正しい動作は次のとおりです。

  • ファイルが選択されたら、入力フィールドの横に my_button を作成します
  • my_button が存在する場合は、それを削除して別のボタンを作成します (ファイル名で何かを行うカスタム イベントに接続する必要があるため、これが必要です) 。

私の質問は、ボタンを正しく削除するにはどうすればよいですか? my_button html コードはページ ソースに表示されないことに注意してください。

ありがとう

4

2 に答える 2

0

単純な考えで申し訳ありませんが、これだけできませんでしたか？

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

これはあなたが探していたものですか？私があなたを誤解した場合は、遠慮なく訂正してください。

于 2009-05-11T08:54:18.453 に答える
0

解決しました。次の方法でそれぞれに ID を設定します。

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++;
    }
}
于 2009-05-11T10:25:25.903 に答える