在文档加载时触发Jquery click事件

时间:2012-09-02 10:36:59

标签: jquery backbone.js

这是我的代码:

<!DOCTYPE html>
<html>

  <head></head>

  <body>
    <div id="someElement">
      <button id="someButton">Click Me</button>
    </div>
    <script src="jquery-1.4.4.min.js"></script>
    <script src="underscore-min.js"></script>
    <script src="backbone-min.js"></script>
    <script>
      MyView = Backbone.View.extend({
        events: {
          "click #someButton": "clicked"
        },
        clicked: function (e) {
          e.preventDefault();
          alert("I was clicked!");
        },
        render: function () {
          var html = "generate some HTML, here";
          $(this.el).html(html);
        }
      });

      $(function () {
        var myView = new MyView();
        myView.render();
        $("#someElement").html(myView.el);
      });
    </script>
  </body>

</html>

http://jsfiddle.net/LfGtu/

我的问题是:如何点击按钮点击点击事件?

(顺便说一句,代码部分来自http://lostechies.com/derickbailey/2011/11/09/backbone-js-object-literals-views-events-jquery-and-el/

3 个答案:

答案 0 :(得分:5)

添加jQuery单击事件的另一种方法是将渲染方法移出jQuery onReady事件并移动到代码中已经存在的单击处理程序“clicked”。您只需在创建视图时将'#someElement'作为'el'属性传递。

在这里制作一个快速的jsBin演示:http://jsbin.com/ugafod/4

这种方法似乎更“Backbone-ish”,但两种方式都可以正常工作。

答案 1 :(得分:2)

什么按钮?您的render活动更改了#someElement个内容。您的按钮在点击之前就已消失。

答案 2 :(得分:1)

您使用了自动调用功能。这就是本质 - 浏览器将在加载html页面的那一部分后立即运行该功能。如果要推迟它,则需要将其与操作相关联,例如:

$('my div or button or whatever you like').click(function(){
    // Function to run here.
});

我为你创建了一个jsFiddle。这应该是你想要的。

相关问题