动态将 Javascript 加载到 HTML 中的问题 [已关闭]

问题描述 投票:0回答:0

使用javaScript和ajax动态加载菜单类别

       ~~~~~~~~~Please check it and help~~~~~~~~~

\有一个餐厅网站,我们的网络应用程序的首页包含 3 个可点击的图块:菜单、特色菜和地图。如果您单击“特价”图块,您将进入一个类别页面,其中将显示属于“特价”菜单类别的所有菜单项。我在此作业中的任务是更改此行为,以便当用户单击特价磁贴时,Web 应用程序会将用户带到随机的单一类别菜单页面,列出该类别中的菜单项,无论是“午餐”、“晚餐” ”、“寿司”等。这样,任何随机类别都可以成为特价商品!


大多数辅助功能已经为我编写好了,我只需要执行几行指令并执行在主页上加载随机菜单并访问组织了菜单类别数据的外部 JSON 文件使用 get.HTTP 请求在单独的脚本文件中。我将在下面输入 git 存储库链接,以便您可以检查我是否正确执行。

~~~~~~~~~~~~~~~~~~~~~~

chrome 开发者工具控制台错误消息显示:

无法加载资源:net::ERR_CONNECTION_RESET

跨源请求被阻止:同源策略不允许读取远程资源 https://....

回到这段代码:

~~~~~~~~~~~~~~~~~~~~~
 **ajax.utils.js code snippet**

` // Makes an Ajax GET request to 'requestUrl'
ajaxUtils.sendGetRequest = 
function(requestUrl, responseHandler, isJsonResponse) {
var request = getRequestObject();
request.onreadystatechange = 
function() { 
handleResponse(request, 
responseHandler,
isJsonResponse); 
};
request.open("GET", requestUrl, true);
request.send(null); // for POST only
};`



   **JavaScript code snippet**

` document.addEventListener("DOMContentLoaded", function(event){

// On first load, show home view
showLoading("#main-content");
$ajaxUtils.sendGetRequest(
allCategoriesUrl,
[buildAndShowHomeHTML],
true);
});
// Builds HTML for the home page based on categories array
// returned from the server.
function buildAndShowHomeHTML(categories) {
// Load home snippet page
$ajaxUtils.sendGetRequest(
homeHtmlUrl,
function (homeHtml) {
var chosenCategoryShortName = 
chooseRandomCategory(categories).short_name;
var homeHtmlToInsertIntoMainPage = insertProperty(homeHtml,
'randomCategoryShortName', '\'' + chosenCategoryShortName + 
'\'');
insertHtml("#main-content", homeHtmlToInsertIntoMainPage);
},
false);
};`

//

     ''''''''''''''''''''''''''''''''''''''''''''''''''''


    ~~~~Source Link~~~~

链接到存储库

网站链接

     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  
javascript json ajax cors same-origin-policy
© www.soinside.com 2019 - 2024. All rights reserved.