在执行上一个语句之前会显示Javascript警告框
我有一个奇怪的问题，但这并不奇怪，因为我是一个JavaScript新手。 基本上我正在创建一个简单的高低牌纸牌游戏。 （抽两张牌，最高牌获胜）。 无论如何，代码如下。
该程序的基本流程非常简单。 我选择2个随机数（1-52）。 这些号码映射到相应的卡。 （即数字1是黑桃的王牌，37号是俱乐部的杰克等）。 无论如何，在绘制卡片之后，程序将显示相应的卡片并确定获胜者。 在所有这一切结束时，我有一个警报，并告诉获胜者抽奖，并询问用户是否想再次播放。
我遇到的问题是：即使程序应该已经显示了卡的图像并将结果输出到文本区域，警报框会在任何实际发生之前显示，并且永远不会显示卡片或结果。 有任何想法吗？ 到目前为止，我发布了所有代码，任何帮助将不胜感激。 提前致谢。
function drawCards() { var oppCard = randNumber(); var customerCard = randNumber(); while (oppCard == customerCard) { customerCard = randNumber(); } var oppCardName = displayCard(oppCard, "oppImage"); var customerCardName = displayCard(customerCard, "custImage"); var result2 = "Your card was: " + customerCardName; var result1 = "The opponent's card was: " + oppCardName; var result3 = determineWinner(oppCard, customerCard); var result4 = result3 + '\n' + result1 + '\n' + result2; $("#textareaRes").text(result4); playAgain(result3); } function determineWinner(oppsCard, customersCard) { var oppValue = oppsCard % 13; var customerValue = oppsCard % 13; var winnerString = ""; if (oppValue == 0) { oppValue = 13; } if (customerValue == 0) { customerValue = 13; } if (oppValue == customerValue) { winnerString = "You Tied."; } else if (oppValue > customerValue) { winnerString = "You Lose."; } else if (oppValue < customerValue) { winnerString = "You Win!!"; } return winnerString; } function randNumber() { var min = 1; var max = 52; var random = Math.floor(Math.random() * (max - min + 1)) + min; return random; } function playAgain(resultString) { if (resultString == "You Lose." || resultString == "You Win!!") { alert(resultString); var conf = confirm("Play Again?"); if (conf == true) { $("#textareaRes").text(""); document.getElementById("custImage").src="./cardImages/default.png"; document.getElementById("oppImage").src="./cardImages/default.png"; } else { window.location = "#mainMenuPage"; } } else { alert(resultString); alert("Try Again."); $("#textareaRes").text(""); document.getElementById("custImage").src="./cardImages/default.png"; document.getElementById("oppImage").src="./cardImages/default.png"; } } 所以我没有把代码放在这里用于显示卡function，只是因为测试它特别长。 对于所有52个随机数，它只是一个巨大的开关盒。 成品实际上将从XML文件中提取，但我仅将其用于测试目的。 （如果由于某种原因，你需要看显示卡的function，请告诉我，我可以发布它。）无论如何，回顾一下，在drawCards（）函数中进行的最后一次调用是playAgain函数。 运行此代码后，将显示结果和卡片图像。 它只是跳转到playAgain函数调用的警报。 这可能是一个相当愚蠢的问题，但我有点困惑。 所以，你们提供的任何帮助都将非常感激。 谢谢。
[编辑：它实际上在计算机的浏览器中正确执行。 但是，问题发生在手机或平板电脑等移动设备上。 所以这可能是我在这里做错了。 任何帮助是极大的赞赏。]
只要您的Javascript代码正在运行，浏览器中的更改就不会显示。
浏览器是事件驱动的，因此更改DOM中的元素不会立即显示更改，而是触发事件以重绘元素。 当您的function运行完毕后，浏览器将处理所有待处理事件并显示更改。
因此，在构建应用程序时，必须使用相同的方法，以便浏览器有机会显示更改。
“./cardImages/default.png”
我不确定…但尝试“../cardImages/default.png”…我总是用2个点来达到更高的水平
对于那些发现这个寻找问题解决方案的人，可以在这个答案中找到解决方案： https ： //stackoverflow.com/a/13338585/870729
这是一个简单例子的工作小提琴 ：
jQuery(function($) { $.when($('#empty-me').html('')).done(function() { alert('I did it!'); }); });