Question

如何自动触发文件输入？即。在下面的链接中我想在加载时触发上传按钮

<form id="test_form">
    <input type="file" id="test">
    <div id="test1">
        <button>Upload</button>
    </div>
</form>

$("#test1").trigger('click');
$("#test").trigger('click');

Answer 1

出于安全考虑，无法在onload中自动触发文件输入。没有任何用户交互就无法触发它。当页面加载时，页面会激活任何内容，这非常令人厌恶。

顺便说一下。您可以使用标签代替以下按钮：

<label for="test">Upload</label>

Answer 2

$("document").ready(function() {
    setTimeout(function() {
        $("#test1").trigger('click');
    },10);

    $('#test1').click(function(){
        alert('hii');
    })
});

点击事件触发。

http://jsfiddle.net/j9oL4nyn/1/

Answer 3

你可以写这样的东西

$(document).ready(function(){
    $("input#test").click();
});

这应该可以正常工作

Answer 4

您的代码的问题在于您将click事件应用于输入以及包含该按钮的div，而不是实际按钮。

如果你改变你的小提琴

<form id="test_form">
  <input type="file" id="test">
      <div id="test1"><button onclick="alert('click');">Upload</button></div>
</form>

和

$("#test1 button").trigger('click');

然后点击触发器将应用于按钮。或者给你的按钮一个ID和fo

$("#buttonid").trigger('click');

Answer 5

在没有用户操作的情况下，无法使用subView = [[[NSBundle mainBundle] loadNibNamed:@"viewName" owner:self options:nil] objectAtIndex:0]; [subView setFrame:infoview.frame]; [self.mapview addSubview:subView];以编程方式打开“打开文件”对话框;见Trigger click on input=file on asynchronous ajax done()。

或者，可以在javascript html事件处创建一个覆盖document的元素，以便为用户提供.ready()选项，通过调用{打开“打开文件”对话框点击“关闭”，click元素上的{1}}或click的紧密叠加。

input type="file"

html

$(function() {

  function openFileDialog() {
    button.fadeTo(0,1).find(input)[0].click();
    dialog.hide();
  }

  function closeDialog() {
    dialog.hide();
    button.fadeTo(0,1);
  }

  var input = $("input[type=file]")

  , button = $("#button").on("click", function(e) {
    e.stopPropagation();
    this.firstElementChild.click()
  })

  , options = $("<button>", {
    css: {
      position: "relative",
      top: "36vh",
      left: "12vw",
      fontSize: "3.6em"
    }
  })

  , dialog = $("<div>", {
      id: "dialog",
      css: {
        position: "absolute",
        zIndex: 2,
        opacity: 0.25,
        background: "dodgerblue",
        width: window.innerWidth - 30,
        height: window.innerHeight
      }
    })
    .append(
      options
      .clone(false)
      .on("click", openFileDialog)
      .html("Open File")
    , options
      .clone(false)
      .on("click", closeDialog)
      .html("Close")
    )
    .prependTo("body");
  
});

Answer 6

你可以这样做：

<button id="upld_btn">Upload</button>

$(document).ready(function () {
   $('#upld_btn').trigger('click');
});

Answer 7

<form id="test_form">
  <input type="file" id="test">
      <div id="test1"><button>Upload</button></div>
</form>

更改您的JS代码，如下所示。

$("#test1 button").click(function() {
$("#test").trigger('click');
});

Working Demo

Answer 8

Show input file dialog on load?

如此处所述，只有Internet Explorer允许以编程方式打开“文件上载”对话框。所以简短的回答是否定的，没有办法在页面加载时自动打开文件上传对话框。

您可能会考虑的答案很长，您可以在用户点击任何内容时展示它。您更喜欢AngularJS解决方案的事实告诉我们您正在编写单页应用程序。此外，我不认为您需要在应用首次加载时显示“文件上载”对话框。在用户点击某些内容之后，您很可能需要在用户交互后显示它。使用此处的AngularJS指令，可能看起来像是文件输入。单击（相同的用户交互），您还可以切换到AngularJS应用程序中的另一个路径，有效地模拟用户导航到另一个页面并自动向他显示“文件上载”对话框。

触发文件输入对话框

8 个答案: