如何将事件的 'this' 对象更改为其他函数？

Question

我有多行包含文件上传控件，在特定行文件上传控件的 onchange 事件中，我选择第一列文本并通过 ajax 请求发送其值。

$(document).on('change','#uploadSupportingDoc',function(){
   console.log("on change called!");
   var questionId = $(this).parent().siblings(":first").text(); // 1st column

   console.log("fileUpload called with Id =>"+questionId);
   uploadFile(questionId,this);

});

但是有一列（带有 css class .fileuploadSuccess ）我想更改图标以显示上传成功或失败。

function uploadFile(questionId,row){
console.log("fileUpload called with Id =>"+questionId);

var isUploaded = false;
$('#uploadSupportingDoc').fileupload({
    url: 'uploadSupportingDoc.html',
    formData: {questionId: questionId },
    acceptFileTypes: /(\.|\/)(jpe?g)$/i,
    maxFileSize: 100,
    dropZone: null,
    pasteZone: null,
    fileInput: $(this),
    dataType: 'json',
    add: function(e, data){

        $(row).closest('tr').children('td.fileuploadSuccess').html('<img src="./img/ajax-loader.gif" alt="Uploading..." />');
        data.submit();
    },
    done: function (e, data){
        var response = data.result.files[0];

        if(!response.isRequestValid)
        {
            window.location = "requestDenied.html";
        }
        else
        {
            if(response.status)
            {
                $(row).closest('tr').children('td.fileuploadSuccess').html("<span class=\"glyphicon glyphicon-ok\" aria-hidden=\"true\"></span>")
            }
            else
            {
                $(row).closest('tr').children('td.fileuploadSuccess').html("<span class=\"glyphicon glyphicon-remove\" aria-hidden=\"true\"></span>")               
            }
        }
    },
    fail: function(e, data){
        console.log("failed");
        console.log(data.jqXHR.responseText);
        console.log(data.jqXHR+"\m");
    },
    always: function (e, data){

    }
 });


}

我试过这样发送，

uploadFile(questionId,this);

并尝试像这样访问它，

$(row).closest('tr').children('td.fileuploadSuccess').html("<span class=\"glyphicon glyphicon-ok\" aria-hidden=\"true\"></span>");

但这是行不通的，每次它都在更改第一行列的值。为什么会这样？有什么解决办法吗？

Answer 1

实际上，您不需要在那里传递行。传递要更新的元素 html:

$(document).on('change','#uploadSupportingDoc',function(){
   console.log("on change called!");
   var questionId = $(this).parent().siblings(":first").text(); // 1st column
   console.log("fileUpload called with Id =>"+questionId);

   var cell = $(this).parent().siblings('.fileuploadSuccess');
   uploadFile(questionId, cell);

});

将function uploadFile(questionId,row){更改为function uploadFile(questionId,cell){

然后您可以简化： $(row).closest('tr').children('td.fileuploadSuccess').html(..);

到 cell.html(...);

如何将事件的 'this' 对象更改为其他函数？

How can change event's 'this' object to other function?

javascript

jquery

file-upload

jquery-file-upload