javascript - JQuery .click() 函数在 ajax 调用中不起作用

Question

我有以下带有文件输入的表单，需要根据 Ajax 调用的结果激活该输入。

<form id="checkin_form" enctype="multipart/form-data" method="post" style="visibility:hidden;">
    <input type="file" name="file[]" id="checkinfile"><br>
</form>

触发点击功能的javascript函数是:

function clickCheckInFile() 
{
    var file_index = selected_file.id;
    var file_name = $(selected_file).children('td:nth(1)').text();

    $.ajax({
        url: "scripts/check_file.php",
        type: "POST",
        dataType:'json',
        data: {file_index: file_index, file_name: file_name},
        success: function(data){
        if (data['response'] == 200)
        {
            if (data['type'] != "dir")
            {
                if (data['checked_out'] == 1 || data['checked_out'] == "1")
                {
                    if (data['checked_out_by'] == username)
                    {
                        if (data['user_permissions'][1] == 1)
                        {
                            $('#checkinfile').click(); 
                        }
                        else
                        {
                            alert('Access Denied.');
                        }
                    }
                    else
                    {
                        alert('Access Denied');
                    }
                }
                else
                {
                    alert('File is not checked out.');
                }
            }
            else
            {
                alert('Cannot check out a folder');
            }
        }
        else if (data['response'] == 300)
        {
            alert(data['message']);
        }
        else
        {
            handleAjaxResponse(data['response']);
        }
    }});
}

不起作用的行是 $('#checkinfile').click();部分。我可以放置一条在该位置触发的警报消息，以便代码调用该行。当我将点击移动到 ajax 调用之前时，它工作正常。

Answer 1

您似乎正在尝试强制单击事件。 .click() 表示单击时要执行的操作 - 它不会触发单击。

使用 .trigger() 来实现:

$('#checkinfile').trigger('click');

然后你需要单独添加点击时要执行的操作，如下所示:

 $('#checkinfile').click(function(){
//do things here
});

至于文件浏览器的问题。尝试这个解决方案from this article :

将输入定位为 position:absolute 和 top:*number ，这会将其从视口(viewport)中删除* 并且它将起作用

Here's the docs for .trigger()