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

时间:2015-01-14 19:28:26

标签: javascript jquery html ajax

我有以下形式的文件输入,需要根据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']);
        }
    }});
}

行无效的是$(&#39; #checkinfile&#39;)。click();一部分。我可以在该位置发出一条警告消息,以便代码调用该行。当我将点击移动到ajax调用之前时,它可以正常工作。

4 个答案:

答案 0 :(得分:2)

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

使用.trigger():

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

然后你需要单独添加点击它时要做的事情:

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

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

将输入定位为position:absolutetop:*number that will remove it from viewport*,它将正常工作

Here's the docs for .trigger()

答案 1 :(得分:2)

虽然在触发事件时通常首选use .trigger() instead(如果没有其他原因而不是清晰度),这行代码似乎工作正常:

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

(假设选择器找到了你期望的元素)

然而,真正的问题是......当点击事件被触发时,你期望这个元素做什么?根据发布的代码,没有事件处理程序。

这是一个文件输入,所以你可能希望它为用户打开文件对话框?虽然某些浏览器可能可能会这样做,但我怀疑它不是标准或预期的行为。文件输入因此类事件(事件,样式等)而臭名昭着,有时可能会有点痛苦。

怀疑正在发生的事情是,出于安全原因,浏览器在调用文件对话框之前需要实际用户交互。同样,这种行为可能是浏览器特定的,但请看一下这里的几个例子:

模式似乎是打开文件对话框需要手动交互,即使它是从代码中打开的。

答案 2 :(得分:0)

检查出来:

&#13;
&#13;
$('#clickme').click(function() {
  $('#checkinfile').click();
});

$(document).on('change', '#checkinfile', function() {
  alert($(this).val());
});
&#13;
<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>
&#13;
&#13;
&#13;

答案 3 :(得分:-1)

很容易

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

您可以在此处查看文档: http://api.jquery.com/on/

希望它可以帮到你