Javascript FileReader.onload在表单提交(POST)后不工作

Javascript FileReader.onload在表单提交(POST)后不工作,javascript,jquery,html,node.js,filereader,Javascript,Jquery,Html,Node.js,Filereader,目前,我正在创建一个单页上传程序。我用Javascript(+jQuery)开发并使用 此上载程序有2个表单,其中上载输入可用。一页中的两个表单和第二个表单都是隐藏的display:none 两者都使用相同的自定义上载扩展名 在第一种形式中,我要求两张图片,它们必须被删除 当我放下图像时,它会通过套接字上传到我的nodejs服务器并正确保存 当我再次删除第二个时,它被上传到我的nodejs服务器并正确保存 然后我将表单发布到我的nodejs服务器 然后我.hide()第一个表单和.show()

目前,我正在创建一个单页上传程序。我用Javascript(+jQuery)开发并使用

此上载程序有2个表单,其中上载输入可用。一页中的两个表单和第二个表单都是隐藏的
display:none

两者都使用相同的自定义上载扩展名

  • 在第一种形式中,我要求两张图片,它们必须被删除

  • 当我放下图像时,它会通过套接字上传到我的nodejs服务器并正确保存

  • 当我再次删除第二个时,它被上传到我的nodejs服务器并正确保存

  • 然后我将表单发布到我的nodejs服务器

  • 然后我
    .hide()
    第一个表单和
    .show()
    第二个表单

当我再次使用上传插件时,不会出现任何错误,但也不会上传任何文件

我注意到在发布第一个表单后,不会执行FileReader.onload

下面是一些示例代码,我无法发布我的整个应用程序

HTML Node.js
一旦加载javascript,就会调用函数filedrop,但此时会隐藏form2。从API:

处理程序附加到jQuery中当前选定的元素 对象,因此这些元素必须存在于调用.bind()的点处 发生。有关更灵活的事件绑定,请参阅事件绑定的讨论 .on()或.delegate()中的委托

因为form2是隐藏的,所以从不绑定drop事件,也从不调用其事件处理程序。reader.onload在此事件处理程序中
.on
是将事件处理程序函数附加到元素的首选方式

所以改变这个

$this.bind('drop', function(event) {


这不起作用,
$this.bind('drop',函数(event){
以第二种形式执行。当我在drop事件中执行
console.log()
时,它起作用。只有onload不起作用。如果我同时显示两种形式,我的上载程序也起作用。因此,你就在某个地方。
// File upload extension
$.fn.extend({
    filedrop: function() {
        return this.each(function() {
            var files = []
            var $this = $(this)

            // Catch drop event
            $this.bind('drop', function(event) {
                event.stopPropagation()
                event.preventDefault()

                console.log('Dropped') // Works in both forms

                files = event.originalEvent.target.files || event.originalEvent.dataTransfer.files

                file = files[0]

                var reader = new FileReader()

                // reader.onload only works in form 1
                reader.onload = function(e) {
                    var buffer = e.target.result
                    socket.emit('uploadfile', file.name, buffer)
                }

                reader.onerror = function(error) {
                    console.log("error", error)
                    console.log(error.getMessage())
                }

                reader.readAsBinaryString(file)

                return false
            })
        })
    }
})

$('.uploadinput').filedrop()

window.showFormTwo = function() {
    $('#formone').hide()
    $('#formtwo').show()
}
app.router.post('/formone', function() {
    window.showFormTwo()
})
$this.bind('drop', function(event) {
$this.on('drop', function(event) {