javascript - jQuery mousedown 不适用于文件提交按钮

Question

我有一个联系表单(Drupal Webform)，其中包含一个文件上传，该文件上传创建一个包含此标记的表单(在本例中我已经删除了名称、大小和 ID 属性):

<div class="form-managed-file">
    <input type="file" class="form-file">
    <input type="submit" value="Upload" class="form-submit ajax-processed">
    <input type="hidden" value="0">
</div>

我希望在文件上传时自动单击上传按钮。我过去曾使用这样的函数完成此操作，但它不适用于此函数:

$('.webform-client-form').on('change', 'input.form-file', function() {
    $(this).next('input[type="submit"]').mousedown();
}); 

但是这些正在使用此表单:

$('.webform-client-form').on('change', 'input.form-file', function(){
    $(this).next('input[type="submit"]').css("background", "red");
    alert($(this).next('input[type="submit"]').val());
});

第一个为按钮提供红色背景。第二个警报是“上传”。为什么鼠标按下不起作用？我还使用了 click() trigger("click") 和 trigger("mousedown") 但他们都没有点击上传按钮。我正在使用 jQuery 1.10。

Answer 1

您仅触发鼠标按下。您还需要捕获触发器并采取相应的行动，例如:

$('.webform-client-form').on('mousedown', 'input[type="submit"]', function() {
    alert ("mousedown");
});

如果我没记错的话，您要做的就是在触发 .change 时提交表单。如果是这种情况，您不妨在 .change 处理程序中提交表单，例如:

$('.webform-client-form').on('change', 'input.form-file', function() {
    $('.webform-client-form').submit();
});