Question

<form
      action="some url"
      method="POST"
      target="_blank"
>
    {_.map(somedata, (value, key: string) => (
     <input name={key} key={key} type="hidden" value={value}/>
      ))}
</form>

我正在使用一个页面，该页面单击某些按钮即可提交表单，这会发布一些数据并在新选项卡中打开一个页面。当我使用Add to Home Screen功能创建PWA快捷方式并从内部提交表单时，此方法在chrome mobile android系统中运行良好，但不起作用（新的url在新标签页中打开，但不显示表单发布的数据）它。此外，新标签仅在PWA中打开，而不是在移动Android chrome中打开。

Answer 1

我很抱歉这与Jquery有关（它的核心是使用核心JS），但是我认为这类似于解决表单发布问题。它使用JS FormData对象，该对象也允许文件。

function formPost(form){
    var formData = new FormData();

    $(form).find('input,select,textarea').each(function(){
        if ($(this).attr('type') == 'file'){
            use = $(this).get(0).files[0];
        } else {
            use = $(this).val();
        }

        formData.append($(this).attr('name'),use);
    })

    var request = new XMLHttpRequest();
    request.open('POST',$(form).attr('action'));
    request.send(formData);
}

值得一提的是，对于浏览器，这至少需要IE10，但我认为在2019年底，我们不必为此担心！ https://caniuse.com/#search=formdata（PWA在“现代浏览器”中运行）。

使用Post方法的表单提交不适用于PWA中的目标_blank

1 个答案: