找不到 Iframe 中的 SCORM 课程 API
SCORM Course in Iframe can't find API
(我是 SCORM 和 Web 开发的新手,如果我解释得不够好,请原谅我。)
我正在尝试 运行 一些 SCORM 课程,并且一直在按照本教程进行操作:http://www.vsscorm.net/2009/05/31/getting-started-the-rte-frameset/
但是,在本教程中,他们使用框架集和框架来建立从课程到 API 实施的这种联系。我需要在 iframe 中 运行 我的课程,并且不知道 where/how 放置我的 API 文档以便我的 SCORM 课程可以找到它并连接到它,有人知道怎么做吗?
在典型的 SCORM 课程中,API 连接在父框架中保持,同时课程内容加载到子框架 (iframe) 中。 iframe中的内容可以随意加载和卸载; iframe 中的内容往往包含您希望在课程的整个生命周期内进行的重要 SCORM 调用,例如分数和完成状态,但它们会通过将信息中继到拥有与 LMS 通信。
这是使用 SCORM 1.2 的快速示例(未在 LMS 中测试,准系统,需要充实)
index.html(父框架)
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Course Title</title>
<style>
/* Use CSS to make the iframe fill the parent frame,
giving impression no frames are being used */
body { padding: 0; margin: 0; overflow: hidden; }
iframe { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: auto; }
</style>
</head>
<body>
<iframe src="" id="course-content" frameborder="0"></iframe>
<script>
//Place initialization routine here.
//Connect to SCORM API, run API.LMSInitialize()
var SCORM_API = window.API; //shortcut reference
function setScore(score){
SCORM_API.LMSSetValue("cmi.core.score.raw", score);
}
function setStatus(status){
SCORM_API.LMSSetValue("cmi.core.lesson_status", status);
}
function endCourse(){
SCORM_API.LMSCommit();//Save, just in case
SCORM_API.LMSFinish();//Close API connection
}
SCORM_API.LMSInitialize();
//Load child frame once SCORM_API is ready
document.getElementById("course-content").setAttribute("src", "content.html");
</script>
</body>
</html>
content.html(子帧)
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Course Content</title>
</head>
<body>
<p>This is the content of the course. Add scripts to make it do something.</p>
<script>
//Place course functionality here, such as setting a bookmark or score.
//'parent' is the parent frame.
//This is a very arbitrary example of what you can do when a course loads
parent.setScore("100");
parent.setStatus("completed");
parent.endCourse();
</script>
</body>
</html>
您通常希望使用 SCORM 包装器来处理一些繁重的工作,并且您希望使用 abstraction layer 来提高代码的可维护性并将 SCORM 命令集中在父框架中。 endCourse()
函数是一个非常简单的抽象层示例。您不是直接在子框架中调用 API,而是调用一个函数。
(我是 SCORM 和 Web 开发的新手,如果我解释得不够好,请原谅我。)
我正在尝试 运行 一些 SCORM 课程,并且一直在按照本教程进行操作:http://www.vsscorm.net/2009/05/31/getting-started-the-rte-frameset/
但是,在本教程中,他们使用框架集和框架来建立从课程到 API 实施的这种联系。我需要在 iframe 中 运行 我的课程,并且不知道 where/how 放置我的 API 文档以便我的 SCORM 课程可以找到它并连接到它,有人知道怎么做吗?
在典型的 SCORM 课程中,API 连接在父框架中保持,同时课程内容加载到子框架 (iframe) 中。 iframe中的内容可以随意加载和卸载; iframe 中的内容往往包含您希望在课程的整个生命周期内进行的重要 SCORM 调用,例如分数和完成状态,但它们会通过将信息中继到拥有与 LMS 通信。
这是使用 SCORM 1.2 的快速示例(未在 LMS 中测试,准系统,需要充实)
index.html(父框架)
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Course Title</title>
<style>
/* Use CSS to make the iframe fill the parent frame,
giving impression no frames are being used */
body { padding: 0; margin: 0; overflow: hidden; }
iframe { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: auto; }
</style>
</head>
<body>
<iframe src="" id="course-content" frameborder="0"></iframe>
<script>
//Place initialization routine here.
//Connect to SCORM API, run API.LMSInitialize()
var SCORM_API = window.API; //shortcut reference
function setScore(score){
SCORM_API.LMSSetValue("cmi.core.score.raw", score);
}
function setStatus(status){
SCORM_API.LMSSetValue("cmi.core.lesson_status", status);
}
function endCourse(){
SCORM_API.LMSCommit();//Save, just in case
SCORM_API.LMSFinish();//Close API connection
}
SCORM_API.LMSInitialize();
//Load child frame once SCORM_API is ready
document.getElementById("course-content").setAttribute("src", "content.html");
</script>
</body>
</html>
content.html(子帧)
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Course Content</title>
</head>
<body>
<p>This is the content of the course. Add scripts to make it do something.</p>
<script>
//Place course functionality here, such as setting a bookmark or score.
//'parent' is the parent frame.
//This is a very arbitrary example of what you can do when a course loads
parent.setScore("100");
parent.setStatus("completed");
parent.endCourse();
</script>
</body>
</html>
您通常希望使用 SCORM 包装器来处理一些繁重的工作,并且您希望使用 abstraction layer 来提高代码的可维护性并将 SCORM 命令集中在父框架中。 endCourse()
函数是一个非常简单的抽象层示例。您不是直接在子框架中调用 API,而是调用一个函数。