Как заставить работать событие jquery bind

Question

По некоторым причинам мои события связывания не будут работать. Вы можете увидеть мой код здесь: http://dl.dropbox.com/u/145581/MyPage/default.html

При нажатии на кнопку «Добавить гаджет» или кнопку «Удалить гаджет» должны срабатывать оповещения, но ничего не происходит.

Есть идеи?

Answer 1

Ваши звонки на bind сделаны вне вашего $(document).ready( ) обработчика, поэтому ваши элементы еще не там. Либо переместите их в $(document).ready(), либо используйте jQuery's live(...).

Answer 2

Во-первых, убедитесь, что вы переместили свои методы bind() в событие $(document).ready(). Так как они вызываются до того, как DOM готов (а именно, до того, как эти элементы DOM даже существуют), событие не может быть связано с ними.

Кроме того, передача объектов в bind() не поддерживается до jQuery 1.4. (Вы можете использовать приведенный ниже код или обновить его до версии 1.4, чтобы использовать методы bind() как есть. (Вам все равно нужно будет переместить их внутрь события ready().

$(document).ready(function(){
    // enable sortable on all columns
    // this will add drag-and-drop functionality as well
    $("#mypage_column1").sortable({
        items: '.gadget', // the type of element to drag
        handle: 'h2', // the element that should start the drag event
        opacity: 0.9, // opacity of the element while draging
        connectWith: ["#mypage_column2"]
    });

    $("#mypage_column2").sortable({
        items: '.gadget', // the type of element to drag
        handle: 'h2', // the element that should start the drag event
        opacity: 0.9, // opacity of the element while draging
        connectWith: ["#mypage_column1"]
    });

    $("img.btn_delete").bind('click', function() {
        alert("Removing this gadget");
      });

    $("img.mypage_add_gadget").bind('click', function() {
        alert("Adding a new gadget");
      });
});