### jQuery Switchbutton

Checked by default

Unchecked by default

Disabled by default

With a label

Click the label

With some actions

Uncheck - Check - Disable - Enable

With custom labels and callbacks

With custom options

With « thin » class and labels set to false
With « ios5 » class

Show code

1.     $(function(){

3.     	/* Simple ones */

5.     	$(".common:checkbox").switchbutton();

9.     	/* Switch 5: with check/enable actions */

11.     	$("#switch5").switchbutton();

13.     	$("#uncheck5").click(function(){

14.     		$("#switch5").prop("checked", false).change();

15.     	});

17.     	$("#check5").click(function(){

18.     		$("#switch5").prop("checked", true).change();

19.     	});

21.     	$("#disable5").click(function(){

22.     		$("#switch5").switchbutton("disable");

23.     	});

25.     	$("#enable5").click(function(){

26.     		$("#switch5").switchbutton("enable");

27.     	});

30.     	/* Switch 6: with custom labels and callbacks */

32.     	$("#switch6")

33.     		.switchbutton({

34.     			checkedLabel: 'YES',

35.     			uncheckedLabel: 'NO'

36.     		})

37.     		.change(function(){

38.     			alert("Switch 6 changed to " + ($(this).prop("checked") ? "checked" : "unchecked"));

39.     		});

41.     	/* Switch 7: with custom options */

43.     	$("#switch7").switchbutton({

44.     		classes: 'ui-switchbutton-thin',

45.     		labels: false

46.     	});

47.     });