Question

我正在制作Chrome应用程序。我一直在控制台中收到错误：

window.alert() is not available in packaged apps. extensions::platformApp:17

该文件的第17行只是一行代码，用于将错误记录到控制台。有没有办法提醒用户Chrome应用中的事件（例如image？）？是因为我在Firefox中安装了adblock（我不使用Chrome）？我认为alert（）非常基本。谢谢你的帮助。

Answer 1

Chrome打包应用中已禁用alert功能，因为它会停止执行Javascript，从而提供糟糕的用户体验。出于开发目的，您应该使用console.log，对于面向用户的交互，您应该使用基于HTML的对话框。

Answer 2

您可以使用在完成之前等待jQuery承诺的函数创建自己的同步警报/提示，然后在用户单击＆＃34; OK＆＃34;按钮解决了这个承诺。然后当你更换你的＆＃34;警报＆＃34;用＆＃34; myCustomAlert＆＃34;你必须将它所调用的函数声明为＆＃34;异步函数＆＃34;然后＆＃34;等待＆＃34;在通话之前。

这可能听起来很复杂但如果你在JSFiddle中使用它很简单。

如果你移植一个应用程序而不是很容易将功能分解到不同的部分，我发现这很有用。这确实需要jQuery库。

以下是我的示例https://jsfiddle.net/littlej247/g4k2h56c/5/

//*****HTML*********

<button type="button" id="alertMe">Alert ME!</button>

<div id="backgroudDiv">  <!-- This is optional but I like to grey out the background -->
  <div id="alertDiv">
    <b><span id="alertTitle"></span></b>
    <br />
    <span id="alertText"></span>
    <hr>
    <button type="button" id="alertDone">OK</button>
  </div>
</div>

//Remember JS can't run in HTML files on chrome apps so functions are called by DOM
document.getElementById("alertMe").onclick = async function () {
  console.log("Starting function \n Processing a bunch of stuff, calculating variable(s)....");
  await myCustomAlert("Alert Title Here","Message");
  console.log("Continue processing stuff with the variable(s) after the alert is clicked.... \n function finished");
};


//*****JavaScript*********

//Alerts can not be used in chrome apps, myCustomAlert function is a replacement.
var alertPromise
function myCustomAlert(messageTitle,messageBody){ 
  console.log("myCustomAlert has been called");
  alertPromise = $.Deferred();

  document.getElementById("alertTitle").textContent=messageTitle;
  document.getElementById("alertText").textContent=messageBody;
  document.getElementById('backgroudDiv').style.display='block';

  return $.when(alertPromise).done();
}

document.getElementById("alertDone").onclick = function () {
  console.log("Finally, User clicked Done, \n now we can get back to work..");
  document.getElementById('backgroudDiv').style.display='none';
    alertPromise.resolve();
    return(false);
};

//*****Styles*********

#alertDiv { 
  width: 400px;
  padding: 15px;
  margin: 100px auto auto auto;
  z-index: 10000;
  background-color: lightblue;
  border-style: solid;
  border-color: black;
 }
#backgroudDiv { 
  display: none; 
  position: fixed; 
  z-index: 9000; 
  left: 0; 
  top: 0; 
  width: 100%; 
  height: 100%; 
  background-color: rgba(0,0,0,0.4); 
 }

window.alert（）在打包的应用程序中不可用

2 个答案: