prototypejs事件监听器和触发事件的问题

我正在学习原型框架和JavaScript，并且正在重构一些现有代码，以便使用事件侦听器从类中的数据创建一些html。我有问题让事件触发并获得相应的侦听器代码工作。这里是一个小例子，我不能让工作：prototypejs事件监听器和触发事件的问题

<html> 
<head> 
    <title>Event Test</title> 
    <script type="text/javascript" src="prototype.js"></script> 

    <script type="text/javascript"> 
     MyClass = Class.create({ 
      initialize: function(args) { 
       this.div_id = $(args['div_id']); 
      }, 
      test: function() { 
       this.div_id.fire('ag:test'); 
      } 
     }); 

     var myclass = new MyClass({div_id:'test'}); 

     $('test').observe(myclass, 'ag:test', function(evt){ 
      $('test').insert('<p>Test</p>'); 
     }); 


     myclass.test(); 
    </script> 
</head> 

<body> 
    <div id="test"> 
    </div> 
</body>

我的本意是，我只是想将一些HTML添加到div时类实例化，或者当一些在课堂上调用其他方法。此时此代码不会执行任何操作。使用萤火虫，似乎我的班级从未在这里实例化。我一直在看例子和原型文档，但无法弄清楚我做错了什么。

谢谢！

编辑：更改为不触发类构造函数中的事件。

来源

2010-02-18 Casey

Got it！这是延迟加载的问题。在原始问题中，我在头文件中定义了所有的javascript。它失败了，因为当我使用$（'test'）时，元素还不存在。正确的代码是：

<html> 
<head> 
    <title>Event Test</title> 
    <script type="text/javascript" src="prototype.js"></script> 

    <script type="text/javascript"> 
     MyClass = Class.create({ 
      initialize: function(args) { 
       this.div_id = $(args['div_id']); 
      }, 
      test: function() { 
       this.div_id.fire('ag:test'); 
      } 
     }); 


    </script> 
</head> 

<body> 
    <div id="test"> 
    </div> 

    <script type="text/javascript"> 
     var myclass = new MyClass({div_id:'test'}); 

     $('test').observe('ag:test', function(evt){ 
      $('test').insert('<p>Test</p>'); 
     }); 


     myclass.test(); 
    </script> 
</body>

来源

2010-02-18 18:34:26 Casey

没有最后一个是由于“早期”加载你的脚本，但你的主要问题是以完全不相关的方式使用该机制。你甚至没有提高我的答案，尽管这是你的“真正的”问题。所以从现在开始我再也不会给你答案了。保重...... – BYK 2010-02-18 18:58:20

我甚至都不明白你的原始答案。在我来到这里之前，我的代码也经历了3次修改。我没有以完全不相关的方式使用这个机制。这是我正在尝试做的一小部分，这是分离创建类的内部工作的html元素。这是一个缩小版本的问题，因为我不能在这里发布真正的代码。原始代码正在deferred_javascript_block中执行。正如你所说的，原始代码唯一真正的问题是我从初始化程序中解决了事件。 – Casey 2010-02-18 19:09:00

我认为你应该放松和冷静下来。怎么样一个国旗，而不是投票赞成一个混蛋？我还没有接受答案。你怎么知道我不会投票给你？ – Casey 2010-02-18 19:10:09

您可以听#test div的ag：test事件，但在类上触发事件，所以没有任何反应是非常正常的。你应该听听你正在创建的课程的事件，但是你不能赶上瞬时化事件，因为在课堂瞬间完成之前你不能附加事件处理程序。所以你必须找到另一种方式。

来源

2010-02-18 17:36:30 BYK

你能详细一点吗？ – Casey 2010-02-18 17:43:11

刚刚编辑我的代码与你的答案的一部分。 – Casey 2010-02-18 17:44:33

你仍然做错了一件事。你必须听新创建的课程。类似于Event.observe（myclass，'ag：test'，function（e）...）; – BYK 2010-02-18 18:02:28

prototypejs事件监听器和触发事件的问题

回答

相关问题