Javascript backbone.js中未调用函数_Javascript_Html_Backbone.js

Javascript backbone.js中未调用函数

javascript html backbone.js

Javascript backbone.js中未调用函数,javascript,html,backbone.js,Javascript,Html,Backbone.js,我正在尝试使用backbone.js将函数绑定到按钮，但按钮上不会调用该事件。这是对应的HTML： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta name="apple-mobile-web-app-ca

我正在尝试使用backbone.js将函数绑定到按钮，但按钮上不会调用该事件。

这是对应的HTML：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title></title>



  <link rel="stylesheet" href="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.css">

  <!-- Extra Codiqa features -->
  <link rel="stylesheet" href="styles/codiqa.ext.css">

  <!-- jQuery and jQuery Mobile -->
  <script src="https://d10ajoocuyu32n.cloudfront.net/jquery-1.9.1.min.js"></script>
  <script src="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>

  <!-- Extra Codiqa features -->
  <script src="lib/codiqa.ext.js"></script>
  <script src="lib/jquery.js"></script>
  <script src="lib/underscore.js"></script>
  <script src="lib/backbone.js"></script>
  <script src="lib/backbone.localStorage.js"></script>
  <script src="app/app.js"></script>
</head>
<body>
<!-- Home -->
<div data-role="page" id="mainPage" class="main-Page">
    <div id="expense-page-header-id" data-theme="a" data-role="header" class="expense-page-header">
        <h3 id="header-text-id" class="header-text">
            Header
        </h3>
    </div>
    <div data-role="content">
        <a id="add-button-id" data-role="button" data-inline="true" 
        href="#mainPage" data-icon="plus" data-iconpos="notext" class="add-button">
        </a>
        <div class="add-content">
            <div data-role="fieldcontain" class="category-input">
                <input name="" id="category-input-id" placeholder="category" value=""
                type="text" data-mini="true">
            </div>
            <div data-role="fieldcontain" class="amount-input">
                <input name="" id="amount-input-id" placeholder="amount" value="" type="text"
                data-mini="true">
            </div>
            <div data-role="fieldcontain" class="description-input">
                <input name="" id="description-input-id" placeholder="description" value=""
                type="text" data-mini="true">
            </div>
            <a id="reset-id" data-role="button" data-inline="true" href="#" data-icon="delete"
            data-iconpos="notext" class="reset">
            </a>
            <a id="done-id" data-role="button" data-inline="true" href="#" data-icon="check"
            data-iconpos="notext" class="done">
            </a>
        </div>

    </div>
</div>
</body>
</html>


标题

我正在尝试将

ToggleDone

方法绑定到

expensesadview

但它不会被调用

我对backbone.js很陌生。

您视图的el是

div.add-content

，视图中的事件只在视图el内部（子级）的元素上触发

按钮.add按钮

不是

div.add-content的子按钮

——它是

div.add-content

的兄弟，因此它上的事件将永远不会出现在视图的el上，因此也不会触发该功能。

感谢您的帮助，我做了必要的更改，它成功了。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title></title>



  <link rel="stylesheet" href="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.css">

  <!-- Extra Codiqa features -->
  <link rel="stylesheet" href="styles/codiqa.ext.css">

  <!-- jQuery and jQuery Mobile -->
  <script src="https://d10ajoocuyu32n.cloudfront.net/jquery-1.9.1.min.js"></script>
  <script src="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>

  <!-- Extra Codiqa features -->
  <script src="lib/codiqa.ext.js"></script>
  <script src="lib/jquery.js"></script>
  <script src="lib/underscore.js"></script>
  <script src="lib/backbone.js"></script>
  <script src="lib/backbone.localStorage.js"></script>
  <script src="app/app.js"></script>
</head>
<body>
<!-- Home -->
<div data-role="page" id="mainPage" class="main-Page">
    <div id="expense-page-header-id" data-theme="a" data-role="header" class="expense-page-header">
        <h3 id="header-text-id" class="header-text">
            Header
        </h3>
    </div>
    <div data-role="content">
        <a id="add-button-id" data-role="button" data-inline="true" 
        href="#mainPage" data-icon="plus" data-iconpos="notext" class="add-button">
        </a>
        <div class="add-content">
            <div data-role="fieldcontain" class="category-input">
                <input name="" id="category-input-id" placeholder="category" value=""
                type="text" data-mini="true">
            </div>
            <div data-role="fieldcontain" class="amount-input">
                <input name="" id="amount-input-id" placeholder="amount" value="" type="text"
                data-mini="true">
            </div>
            <div data-role="fieldcontain" class="description-input">
                <input name="" id="description-input-id" placeholder="description" value=""
                type="text" data-mini="true">
            </div>
            <a id="reset-id" data-role="button" data-inline="true" href="#" data-icon="delete"
            data-iconpos="notext" class="reset">
            </a>
            <a id="done-id" data-role="button" data-inline="true" href="#" data-icon="check"
            data-iconpos="notext" class="done">
            </a>
        </div>

    </div>
</div>
</body>
</html>