jQuery EasyUI Form Plugin -Timespinner Time Spinner

jQuery EasyUI 插件jQuery EasyUI Plugins

Extends from $.fn.spinner.defaults. Override the default defaults via $.fn.timespinner.defaults.

The timespinner is created based on the spinner. It is similar to the numberspinner, but it only displays time values. The timespinner allows users to increase or decrease the time by clicking the small spinner buttons on the right side of the component.

Dependencies

  • spinner

Usage

Create a timespinner from markup.

<input id="ss" class="easyui-timespinner" style="width:80px;"
    required="required" data-options="min:'08:30',showSeconds:true">

Create a timespinner using JavaScript.

<input id="ss" style="width:80px;">

$('#ss').timespinner({
    min: '08:30',
    required: true,
    showSeconds: true
});

Properties

The properties extend from spinner. The following are the added properties for timespinner.

Name Type Description Default
separator string The separator between hours, minutes, and seconds. :
showSeconds boolean Defines whether to display the second information. false
highlight number The initially highlighted field, 0 = hour, 1 = minute, ... 0

Events

The events extend from spinner.

Methods

The methods extend from spinner. The following are the overridden methods for timespinner.

Name Parameters Description
options none Return the options object.
setValue value Set the value of the timespinner.
Code example:
$('#ss').timespinner('setValue', '17:45');  // set timespinner value
var v = $('#ss').timespinner('getValue');  // get timespinner value
alert(v);
getHours none Get the current hour value.
getMinutes none Get the current minute value.
getSeconds none Get the current second value.
jQuery EasyUI 插件jQuery EasyUI Plugins Other Extensions