Хочу усложнить виджеты JQuery ui, не могу повесить функцию на нестандартный обработчик.
У виджета ui.spinner, есть событие
spin, не соображу как отловить его из потомка.
<!doctype html>
<html>
<head>
<title>test widgets</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<style>
body {
font-size: 62.5%;
font-family: "Trebuchet MS", "Arial", "Helvetica", "Verdana", "sans-serif";
}
table {
font-size: 1em;
}
.demo-description {
clear: both;
padding: 12px;
font-size: 1.3em;
line-height: 1.4em;
}
.ui-draggable, .ui-droppable {
background-position: top;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
</head>
<body>
ui.spinner <input type='text' id='spinner1' /><br>
ui.new_spinner <input type='text' id='spinner2' /><br>
<script language=javascript>
$(function(){
$.widget('ui.new_spinner',$.ui.spinner,{
_create:function(){
$.ui.spinner.prototype._create.call(this);
this._on(this._events);
this.bind('spin',function(){alert('this.bind')}); // не работает
this.element.bind('spin',function(){alert('this.element.bind')}); // не работает
},
_events:{
spin:'on_spin',
change:'on_spin',
click:'onclick'
},
on_spin:function(value){ // не работает
console.log( 'ui.new_spinner' + this.element[0].value );
},
spin:function(){ // тоже не работает
alert('this.spin');
},
onclick:function(){
console.log('this.onclick');
}
})
});
$(function(){
$('#spinner1').spinner({spin:function(){console.log('ui.spinner '+this.value /* this=HTMLInput */)}});
$('#spinner2').new_spinner();
})
</script>
</body>
</html>
