时间戳

首页 > 解决方案 > 自定义“提交”按钮 [krajee 的文件输入]

javascript - 自定义“提交”按钮 [krajee 的文件输入]

问题描述

我有一个经典表单，我在表单中使用 Fileinput。提交按钮，我想将它与表单自己的按钮一起使用。

是否可以取消插件的upload按钮并使用表单的提交按钮？

$("#images").fileinput({
  language: "tr",
  uploadAsync: false,
  allowedFileExtensions: ["jpg", "png", "gif", "jpeg"],
  showBrowse: false,
  browseOnZoneClick: true,
  uploadUrl: "img.php?v=1",
  elErrorContainer: '#kv-error-2',
  showCaption: false,
  showUpload: false,
  showCancel: false,
  overwriteInitial: false,
  uploadExtraData: function(previewId, index) {
    var data = {
      project_id: $("#firstname").val(),
      discussion_title: $("#username").val(),
    };
    return data;
  },
}).on('filebatchpreupload', function(event, data, id, index) {
  $('#kv-success-2').html('<h4>Upload Status</h4><ul></ul>').hide();
}).on('filebatchuploadsuccess', function(event, data) {
  // 
});
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/css/fileinput.min.css" media="all" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/plugins/piexif.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/plugins/sortable.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/plugins/purify.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/fileinput.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/locales/LANG.js"></script>




<form action="/action_page.php" style="padding:20px">
  First name:<br>
  <input type="text" name="firstname" value="Mickey"><br> Last name:<br>
  <input type="text" name="lastname" value="Mouse"><br><br>
  <input id="input-b1" name="input-b1" type="file" class="file"><br><br>
  <input type="submit" value="Submit">
</form>

我怎样才能做到这一点？

标签： javascripttwitter-bootstrapfile-io

解决方案

推荐阅读