웹 페이지에서 Firefox Extension을 통해 요소를 제거합니다

StackOverflow https://stackoverflow.com/questions/847243

  •  21-08-2019
  •  | 
  •  

문제

파일 입력 필드 ( <input type="file"> 태그) 파일이 선택된 경우.

Extension의 논리가 포함 된 파일 오버레이.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이 존재하면 삭제하고 다른 것을 만듭니다 (i 필요 이것은 Beacuse 파일 이름으로 무언가를하는 사용자 정의 이벤트에 연결해야합니다).

내 질문은 : 버튼을 올바르게 삭제할 수있는 방법은 무엇입니까? My_Button HTML 코드는 페이지 소스에 나타나지 않습니다!

감사

도움이 되었습니까?

해결책 2

해결되었습니다. 다음 방법으로 각각의 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++;
    }
}

다른 팁

내가 너무 간단하게 생각한다면 나를 용서하지만, 당신은 이것을 할 수 없습니까?

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

이것이 당신이 찾고 있던 것입니까? 내가 당신을 오해했다면 저를 바로 잡으십시오.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top