Question

我正在使用PhoneGap开发适用于iOS和Android的混合应用程序。可以使用javascript添加按钮并将其事件控制到inappbrowser的工具栏。我知道如何通过ios本机端添加它但我无法使用该过程。我需要通过javascript方法控制按钮事件。

Answer 1

您有两种选择。显然，第一个选项是修补本机插件代码，就是这样。 Here您可以找到针对iOS制作的示例，您必须对Android Java代码以及您想要支持的其他平台执行相同的操作。

另一种选择是隐藏本机工具栏并在加载页面时注入HTML和CSS以创建新工具栏。像这样：

// starting inappbrowser...
inAppWindow = window.open(URL_TO_LOAD, '_blank', 'location=no');
// Listen to the events, we need to know when the page is completely loaded
inAppWindow.addEventListener('loadstop', function () {
  code = CustomHeader.html();
  // Inject your JS code!
  inAppWindow.executeScript({
    code: code
  }, function () {
    console.log("injected (callback).");
  });
  // Inject CSS!
  inAppWindow.insertCSS({
    code: CustomHeader.css
  }, function () {
    console.log("CSS inserted!");
  });

显然你将定义CustomHeader对象，如下所示：

var CustomHeader = {
    css: '#customheader { your css here }',
    html: function() {
      var code = 'var div = document.createElement("div");\
      div.id = "customheader";\
      // Insert it just after the body tag
      if (document.body.firstChild){ document.body.insertBefore(div, document.body.firstChild); } \
      else { document.body.appendChild(div); }';
      return code;
}
};

我遇到过这个问题。对于我的情况，第二种选择就足够了，而不是一项关键任务。有时需要激活loadstop事件，因此您看不到＆gt; = 5秒的注入条。而且你甚至需要注意加载页面的CSS，因为很明显你可以影响原始CSS，或者原始CSS会影响工具栏的样式。

是否可以使用javascript添加按钮并将其事件控制到inappbrowser的工具栏？

1 个答案: