Как сделать подкласс виджета

В jQuery UI 1.8 добавлена ​​возможность расширять виджет с помощью следующего кода:

$.widget("my.weirdbutton", $.ui.button, {
});

Теперь я могу создать weirdbutton и это работает как кнопка:

$("#myButton").weirdbutton();

Однако, только странные события запускаются. Так что, если у меня есть что-то вроде

$(".button").bind("buttoncreate", function() { 
    console.log("a button was created"); 
});

Я буду скучать по всему созданию странных кнопок. Это можно исправить, вручную вызвав события кнопки из виджета странной кнопки. Не отлично, но работает.

Большая проблема в том, что такой код не будет работать:

$("#mybutton").weirdbutton();
$("#mybutton").button("option", "text", "My New Text");

Вторая строка, вместо установки опции для существующей кнопки, создает новую. Я не знаю, как это исправить.

Итак, есть ли способ сделать виджет подкласса, который следует принципу подстановки Лискова?

1 ответ

Я не знаю для .bind подход, но заменив начальный _create Метод можно сделать с помощью этого подхода:

$.widget("my.weirdbutton", $.ui.button, {
    _create: function() {
       $.ui.button.prototype._create.call(this);
       console.log("a button was created");
    }
});  

Затем, если вы делаете (в документе):

$(function() {
  $("#myButton").weirdbutton();      
});

ты должен получить console.log

Полный код здесь: http://jsbin.com/icota4/11/edit

Другие вопросы по тегам