Javascript 当我将一个图像上传到firebase存储并检索下载url并显示在img标记中时，它显示了多次

我正在将图像上载到firebase存储，并再次将URL路径存储在firebase数据库中。但是，当我第一次上传时，它只显示了一次，但当我再次上传到gallery并选择一个图像时，它显示了两次。如果我再次进入“多媒体资料”并选择一个显示了三次的图像。请指导我如何解决这个问题

<img id="image5e" src="img/upload.png" />
<input type='file' style="display:none;" name="photosubmit" id="photosubmit"/>

var-app={
初始化：函数（）{
app.bindEvents（）；
},
bindEvents:function（）{
文件.addEventListener（'devicerady'，this.ondevicerady，false）；
},
ondevicerady:function（）{
var uploadimg=document.getElementById（“image5e”）；
uploadimg.addEventListener（“单击”，app.upload2gallery，false）；
},         
upload2gallery:function（）{
$（“#photosubmit”）。单击（）；
var filebutton=document.getElementById（“photosubmit”）；
filebutton.addEventListener（'change'，函数（e）{
var file=e.target.files[0]；
var storageRef=firebase.storage（）.ref（'sweet_gift/'+file.name）；
var task=storageRef.put（文件）；
在（'state_changed'，函数进度（快照）上的任务{
var load='请稍候'+'正在加载…'；
$.mobile.loading（'show'{
文本：“请稍候…”，
textVisible：对，
html:load，
主题：“z”
});
}，函数错误（err）{
}，函数完成（）{
$.mobile.load（'hide'）；
var uni=localStorage.getItem（“lunicode”）；
var ref=firebase.database（）.ref（uni）；
var myname=storage.getItem（“uname”）；
var myid=storage.getItem（“myid”）；
var downloadURL=task.snapshot.downloadURL；
参考推力({
姓名：我的名字，
imageurl:下载URL，
photoUrl:“/images/profile\u placeholder.png”，
我的id:myid，
});
});
});
},
$（document）.on（'pagebeforeshow'，'#chatpage'，function（）{
var uni=localStorage.getItem（“lunicode”）；
var ref=firebase.database（）.ref（uni）；
$（“#images6”）.empty（）；
参考orderByChild（“消息”）。关于（“添加的子项”，函数（快照）{
$（“#images6”）.append（movielist（snapshot.val（））；
var last_li=$（“.cmsg li:last child”）.offset（）.top；
setTimeout（函数（）{
$.mobile.silentsroll（最后一个）；
}, 50);
ActivityIndicator.hide（）；
});
});
$（document）.on（'pagebeforehide'，'#chatpage'，function（）{
警惕（“前进”）；
var uni=localStorage.getItem（“lunicode”）；
var ref=firebase.database（）.ref（uni）；
$（“#images6”）.empty（）；
//ActivityIndicator.show（）；
参考orderByChild（“消息”）.off（“添加了child”）；
//ActivityIndicator.hide（）；
$（'cmessage'）.val（''）；
});

根据Firebase Google支持工程师Sugestion的说法，我将下面的事件列表器放在DeviceReady函数中，它解决了我的问题

谷歌搜索怒吼

[您可以移动在onDeviceReady上注册文件更改处理程序吗？如果将其放入upload2gallery，每次单击图像时，都会调用upload2gallery，因此您将再次注册文件更改事件，这将导致您的问题。]

var filebutton = document.getElementById("photosubmit");
 filebutton.addEventListener('change', function(e) {
     //Get The File
     var file = e.target.files[0];
     var storageRef = firebase.storage().ref('sweet_gift/' + file.name);
     var task = storageRef.put(file);
     task.on('state_changed',
         function progress(snapshot) {

             var load = '<h1>Please Wait</h1>' +
                 '<i class="fa fa-circle-o-notch fa-spin fa-3x fa-fw"></i> <span>Loading ...</span>';
             $.mobile.loading('show', {
                 text: 'Please wait...',
                 textVisible: true,
                 html: load,
                 theme: 'z'
             });
         },
         function error(err) {

         },
         function complete() {
             $.mobile.loading('hide');
             var uni = localStorage.getItem("lunicode");
             var ref = firebase.database().ref(uni);
             var myname = storage.getItem("uname");
             var myid = storage.getItem("myid");
             var downloadURL = task.snapshot.downloadURL;
             ref.push({
                 name: myname,
                 imageurl: downloadURL,
                 photoUrl: "/images/profile_placeholder.png",
                 my_id: myid,
             });
         }
     );

 });

var filebutton=document.getElementById（“photosubmit”）；
filebutton.addEventListener（'change'，函数（e）{
//获取文件
var file=e.target.files[0]；
var storageRef=firebase.storage（）.ref（'sweet_gift/'+file.name）；
var task=storageRef.put（文件）；
task.on（'state_changed'，
功能进度（快照）{
var load='请稍候'+
“装载…”；
$.mobile.loading（'show'{
文本：“请稍候…”，
textVisible：对，
html:load，
主题：“z”
});
},
函数错误（err）{
},
函数完成（）{
$.mobile.load（'hide'）；
var uni=localStorage.getItem（“lunicode”）；
var ref=firebase.database（）.ref（uni）；
var myname=storage.getItem（“uname”）；
var myid=storage.getItem（“myid”）；
var downloadURL=task.snapshot.downloadURL；
参考推力({
姓名：我的名字，
imageurl:下载URL，
photoUrl:“/images/profile\u placeholder.png”，
我的id:myid，
});
}
);
});