Following event handler can handle: Keyup, Copy, Paste and Cut
(function (a) { a.event.special.textchange = { setup: function () { a(this).data("lastValue", this.contentEditable === "true" ? a(this).html() : a(this).val()); a(this).bind("keyup.textchange", a.event.special.textchange.handler); a(this).bind("cut.textchange paste.textchange input.textchange", a.event.special.textchange.delayedHandler) }, teardown: function () { a(this).unbind(".textchange") }, handler: function () { a.event.special.textchange.triggerIfChanged(a(this)) }, delayedHandler: function () { var b = a(this); setTimeout(function () { a.event.special.textchange.triggerIfChanged(b) }, 25) }, triggerIfChanged: function (b) { var c = b[0].contentEditable === "true" ? b.html() : b.val(); if (c !== b.data("lastValue")) { b.trigger("textchange", b.data("lastValue")); b.data("lastValue", c) } } }; a.event.special.hastext = { setup: function () { a(this).bind("textchange", a.event.special.hastext.handler) }, teardown: function () { a(this).unbind("textchange", a.event.special.hastext.handler) }, handler: function (b, c) { c === "" && c !== a(this).val() && a(this).trigger("hastext") } }; a.event.special.notext = { setup: function () { a(this).bind("textchange", a.event.special.notext.handler) }, teardown: function () { a(this).unbind("textchange", a.event.special.notext.handler) }, handler: function (b, c) { a(this).val() === "" && a(this).val() !== c && a(this).trigger("notext") } } })(jQuery);
Usage:
$("#textboxid").bind('textchange', function (event, previousText) { var textboxContent = $("#textboxid").val(); if (textboxContent == "" || textboxContent == "default value") { $("#buttonid").addClass('disabled').attr('disabled', true); } else { $("#buttonid").addClass('disabled').attr('disabled', false); } });
Reference:
http://www.zurb.com/playground/jquery-text-change-custom-event
nice one
ReplyDeleteto bad it doesnt work
ReplyDeleteJust double check agian, it works
Delete