由于文件上传按钮，联系表格 7 不适用于 Safari答案

【问题标题】：Contact form 7 is not working with Safari due file-upload button由于文件上传按钮，联系表格 7 不适用于 Safari
【发布时间】：2018-07-23 18:30:41
【问题描述】：

如您所知；使用 Safari 和当联系表单包含文件上传按钮时，无法提交使用 CF7 插件构建的联系表单。仅当用户将上传字段留空时才会出现此问题，因此无需选择文件。

对我来说，这个问题的最佳解决方案是在没有选择文件时删除文件上传按钮。我通过以下 Jquery 脚本部分成功地做到了这一点：

jQuery(document).on('submit', '.wpcf7-form', function (e) {
  jQuery('input.wpcf7-file').each(function() {
    if (jQuery(this).val() == '') jQuery(this).remove();
  });
});

只剩下一个问题......当提交表单时，上传字段留空，按钮被移除，但旋转箭头图标一直在旋转，没有任何反应。只有当用户第二次提交表单时，提交才会成功。

所以我想用几行扩展上面显示的代码，以防文件上传字段留空，第二次自动提交联系表单。因此，用户不必两次提交联系表，这可能会非常令人困惑……

有人可以帮我解决这个问题吗？我认为这对许多其他用户来说也是一个很好的解决方案，因为我已经阅读了许多有相同问题的人的主题。

提前致谢，祝您有美好的一天！

最好的问候

【问题讨论】：

标签： file-upload safari contact-form-7

【解决方案1】：

我认为您的问题源于“提交”方法在表单提交开始后触发（或至少在收集表单字段之后）。所以第二次点击它会重新提交没有空字段的表单。

我已经实现了您的脚本的一个版本，但绑定到单击提交按钮，而不是表单的提交方法。到目前为止 - 它似乎正在工作。

我尝试让它只在受影响的浏览器上触发（使用 nagivator.userAgent.match()），但在我正在寻找的短暂时间内没有太多运气。

<script>
jQuery(document).on('click', '.wpcf7-form [type=submit]', function (e) {
  jQuery('input.wpcf7-file').each(function() {
    if (jQuery(this).val() == '') jQuery(this).remove();
  });
});
</script>

【讨论】：