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事件。 .click（）表示單擊時該怎么做-它不會觸發點擊。

為此使用.trigger（）：

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

然后，您需要單獨添加單擊時的操作，如下所示：

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

至於文件瀏覽器的問題 。 從本文嘗試以下解決方案：

將輸入position:absolute為position:absolute和top:*number that will remove it from viewport* ，它將起作用

這是.trigger（）的文檔

Answer 2

雖然通常最好在觸發事件時使用.trigger()代替 （如果出於清晰性沒有其他原因），此代碼行似乎正常工作：

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

（當然，假設選擇器找到了您期望的元素）

但是，真正的問題是...觸發click事件時，您希望此元素做什么？ 根據發布的代碼，沒有為此的事件處理程序。

這是文件輸入，所以也許您希望它為用戶打開文件對話框？ 盡管某些瀏覽器可能會這樣做，但我懷疑這不是標准行為或預期行為。 文件輸入因此類事件（事件，樣式等）而臭名昭著，有時可能會有些痛苦。

我懷疑正在發生的情況是，出於安全原因，瀏覽器在調用文件對話框之前需要實際的用戶交互。 同樣，此行為可能是特定於瀏覽器的，但請在此處查看幾個示例：

• 無法自動調用文件對話框
• 單擊手動按鈕后可以從代碼調用文件對話框
• 使用自動單擊的手動按鈕，無法調用文件對話框

模式似乎是，即使從代碼中打開文件對話框，也需要手動交互。

Answer 3

看一下這個：

 $('#clickme').click(function() { $('#checkinfile').click(); }); $(document).on('change', '#checkinfile', function() { alert($(this).val()); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form enctype="multipart/form-data" id="checkin_form" style="visibility:hidden;"> <input type="file" name="file" id="checkinfile"> </form> <button id="clickme">click</button> 

Answer 4

這很容易

$( "example" ).on( "click", function() {
    alert( "click" );
});

您可以在此處查看文檔： http : //api.jquery.com/on/

希望對您有幫助