Question

我正在使用Ionic框架。

我有一张表格：

<form action='https://secure.payu.in/_payment' method="POST" target="...">
  ......
</form>

提交表单后，我需要在应用内浏览器中打开结果。

作为一个肮脏的黑客，我将表单提交目标指向当前标签中的iframe，但我想避免这种情况。

理想情况下，我需要在应用内浏览器中打开表单操作URL（而不是替换webview中的应用程序，这将导致我失去对应用程序的控制）。

我试图给＆＃34; _blank＆＃34;在目标中但它似乎无法在设备上工作。

我也知道打开应用内浏览器的传统方法是做类似的事情：

var ref = window.open("http://example.com", "_blank", "location=no");

但是，我需要的是提交表单，应该打开应用内浏览器，而不是通过js触发应用内浏览器。

任何帮助表示赞赏！

Answer 1

我最近遇到了同样的问题。我通过使用executeScript方法注入表单来解决这个问题。

首先，你必须在appbrowser窗口中打开一个转换页面（一个空白页面或其他但，jquery引用，你必须在某处托管它）：

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>

然后，添加loadstop侦听器并在那里调用executeScript表单（当URL与转换页的URL匹配时）。

 var browserWindow = window.open('http://transitionpage.com', '_blank', 'location=yes,hidden=yes,hardwareback=no');
 var transitionLoaded = false;
 var finalURL = 'https://finalurl.com';
 var paramName = 'SOME_PARAM';
 var paramValue = 'asdf';
 function injectForm() {
    browserWindow.executeScript({
        code: "var $form;$form = $(document.createElement('form')).css({ display: 'none'}).attr('method', 'POST').attr('action', '" + finalURL + "');$('body').append($form);var $input = $(document.createElement('input')).attr('name', '" + paramName + "').val('" + paramValue + "');$form.append($input);$form.submit();"
    }, function() {
        //Form injected
        transitionLoaded = true;
    });
 }
 browserWindow.addEventListener('loadstop', function(event) {
    if (event.url.indexOf('http://transitionpage.com') !== -1 && !transitionLoaded) {
        injectForm();
    }
 });
 browserWindow.show();

如何在Ionic中将表单数据发布到应用程序内浏览器？

1 个答案: