Javascript 如何在ratchet中使用onclick事件?

Javascript 如何在ratchet中使用onclick事件?,javascript,ratchet-2,Javascript,Ratchet 2,我对Javascript和Ratchet都是新手。我尝试构建一个小应用程序来熟悉它。我已经编写了下面的代码,但不太有效。在“后退”按钮上,我希望调用javascript来保存注释。但是我得到一个错误,找不到note_back()。我做错了什么 index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Notes</title>

我对Javascript和Ratchet都是新手。我尝试构建一个小应用程序来熟悉它。我已经编写了下面的代码,但不太有效。在“后退”按钮上,我希望调用javascript来保存注释。但是我得到一个错误,找不到note_back()。我做错了什么

index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Notes</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link href="css/ratchet.css" rel="stylesheet">
    <script src="js/ratchet.js"></script>
</head>
<body>
    <header class="bar bar-nav">
        <a class="icon icon-plus pull-right" data-transistion="slide-in" href="note.html"></a>
        <h1 class="title">Notes</h1>
    </header>
    <div class="content">
        <ul class="table-view">
        </ul>
    </div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Note</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link href="css/ratchet.css" rel="stylesheet">
    <script src="js/ratchet.js"></script>
    <script src="js/notecontroller.js"></script>
</head>
<body>
<header class="bar bar-nav">
    <a class="icon icon-left pull-left" onclick="javascript:note_back()"></a>
    <a class="icon icon-trash pull-right" onclick="javascript:note_delete()"></a>
    <h1 class="title">Add Note</h1>
</header>
<form>
    <br>
    <br>
    <br>
    <textarea id="notetext" rows="10"></textarea>
</form>
</body>
</html>
截图:

(作为一个附带问题,为什么我看不到note.html?)


问题在于note.html的head部分中的javascript链接没有加载,因此您必须将所有javascript都放在index.html中

Ratchet使用push.js进行导航。当您单击导航时,ratchet通过ajax加载note.html并解析DOM中的内容,因此您的javascript包含不会在后续页面上执行


您需要做两件事:将脚本引用移动到index.html,并将控制器导航从window.location.href(这将重置您的应用程序)更改为调用PUSH({})方法(附加到ratchet.js中的窗口)使用正确的选项。

您看不到note.html,因为ratchet.js使用ajax加载页面转换的内容,所以您的应用程序的行为就像SPA。检索、解析Note.html并交换内容,然后使用历史记录设置窗口位置。如何调用PUSH?我正试图解决这个问题:
function note_back() {
    console.log("reached note_back");
    localStorage.setItem("note",document.getElementById("notetext"));
    window.location.href="index.html";
}
function note_delete() {
    console.log("reached note_delete");
    localStorage.removeItem("note");
    window.location.href="index.html";
}