无法弄清楚如何绑定jQuery事件

Question

所以我在这里有一个页面：http://8wayrun.tv/

它有一个JS文件：

/** @param {jQuery} $ jQuery Object */
!function($, window, document, _undefined)
{
    $('#headbar').load( function($form)
    {
        $( this ).addClass( "test" );
    });
}
(jQuery, this, document);

它是一个相对简单的JS文件;它所做的就是绑定到元素#headbar并添加类test。但是，出于某种原因，它没有将类添加到#headbar。

我做错了什么？

Answer 1

运行JavaScript时，该元素尚不存在。您需要将DOM操作代码放在$(document).ready回调中。

$(document).ready(function () {

  /** @param {jQuery} $ jQuery Object */
  !function($, window, document, _undefined)
  {
    $('#headbar').load( function($form)
    {
        $( this ).addClass( "test" );
    });
  }
  (jQuery, this, document);

});