主页 / 问题 / 1233321
Accepted
hibinyru
Asked:2022-01-19 16:43:44 +0000 UTC2022-01-19 16:43:44 +0000 UTC

jquery type=文件图片和表单提交

  • 772

我不明白为什么单击图像时会发送表单，因为我写了仅在表单更改时才发送表单。帮助，好人，走上正确的道路:)

https://jsfiddle.net/hibinyru/jzt5c9mn/11/

$(".iframe-button-add").bind("click", function(){
  $("#upload").click();
});

$("#upload").change(function(){
  this.form.submit();
  $(".content_more").slideToggle(300);
});
.iframe-button-add {
  width:80px;
  height:80px;
  border-radius: 3px;
  border: solid 1px #ebebeb;
  background: no-repeat center url('https://www.hibiny.com/images/2020/interface/buttons/icons-options-photo-add.png');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<form action="" method="post" enctype="multipart/form-data">
  <div class="content_more" style="display:none;"><img src="/images/2020/interface/preloader/64.gif"></div>

  <button class="iframe-button-add" ></button>
  <input type="file" name="files" id="upload" accept="image/jpeg,image/png,image/gif,image/jpg,image/bmp,image/webp" style="display:none;">

  <input type="hidden" name="form" value="1">
</form>

jquery

1 个回答

  1. Best Answer

    没有属性的按钮元素type默认提交表单。要禁用此功能，请执行以下操作event.preventDefault()：

    $(".iframe-button-add").bind( "click", function(e){
    e.preventDefault();
    $("#upload").click();
});

    或将属性写入按钮type="button"

    • 1

相关问题