2010-09-28 68 views
1

你可以測試我的代碼,當我點擊布頓,我們將得到第一個鏈接2鏈接Mootools - 爲什麼不跑?

點擊,不會提醒

點擊第二個鏈接,顯示警報

爲什麼第一個鏈接不警惕,如何可以提醒?

<html> 
<head> 
<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
<script type="text/javascript">google.load("mootools", "1.1.2");</script> 
<script> 
    window.addEvent('domready', function(){ 
     $('button').addEvent('click', function(){ 
      $('content').innerHTML = $('test').innerHTML; 
     }); 
    }); 

</script> 
</head> 
<body> 
<input id="button" type="button" name="button" value="Click"/> 
<div id="content"> 
</div> 
<div id="test"> 
    <script> 
     function test(){ 
      $('a-content').addEvent('click', function(){ 
       alert(1); 
      }); 
     } 
     window.addEvent('domready', function(){ 
      test(); 
     }); 
    </script> 
    <a id="a-content" href="#">CLICK HERE</a> 
</div> 
</body> 
</html> 

回答

1

當動態注入HTML時,除非使用事件委託,否則不會繼續執行事件。如果您不使用事件委託,事件將只在原始元素上。請參閱http://mootools.net/docs/more/Element/Element.Delegation

您需要執行此類操作。 $('body')。addEvent('click:relay(#a-content)',function(){...});主體將捕獲點擊事件並將其委託給任何ID爲「a-content」的元素。

另外通過設置這樣的內容$('content')。innerHTML = $('test')。innerHTML;你會有重複元素與id「a-content」這是錯誤的。 HTML標識應該是唯一的。嘗試對您可以重複使用的內容進行分類。