javascript - Data binding with jQuery not working with chrome -



javascript - Data binding with jQuery not working with chrome -

i reading this article , reason cannot code work in chrome- ie9 works without issue.

here js:

$(document).ready(function() { function databinder( object_id ) { // utilize jquery object simple pubsub var pubsub = jquery({}); // expect `data` element specifying binding // in form: data-bind-<object_id>="<property_name>" var data_attr = "bind-" + object_id, message = object_id + ":change"; // hear alter events on elements data-binding attribute , proxy // them pubsub, alter "broadcasted" connected objects jquery( document ).on( "change", "[data-" + data_attr + "]", function( evt ) { var $input = jquery( ); console.dir('test message'); pubsub.trigger( message, [ $input.data( data_attr ), $input.val() ] ); }); // pubsub propagates changes bound elements, setting value of // input tags or html content of other tags pubsub.on( message, function( evt, prop_name, new_val ) { jquery( "[data-" + data_attr + "=" + prop_name + "]" ).each( function() { var $bound = jquery( ); if ( $bound.is("input, textarea, select") ) { $bound.val( new_val ); } else { $bound.html( new_val ); } }); }); homecoming pubsub; }; function user( uid ) { var binder = new databinder( uid ), user = { attributes: {}, // attribute setter publish changes using databinder pubsub set: function( attr_name, val ) { this.attributes[ attr_name ] = val; binder.trigger( uid + ":change", [ attr_name, val, ] ); }, get: function( attr_name ) { homecoming this.attributes[ attr_name ]; }, _binder: binder }; // subscribe pubsub binder.on( uid + ":change", function( evt, attr_name, new_val, initiator ) { if ( initiator !== user ) { user.set( attr_name, new_val ); } }); homecoming user; }; var user = new user( 123 ); user.set( "name", "wolfgang" ); });

html:

<!doctype html> <html> <head> <title>test</title> <script src="../../jquery/jquery.js"></script> </head> <body> <input type="number" data-bind-123="name" /> <script src="js/myjsfile.js"></script> </body> </html>

i added console.dir('test message') should logged when alter event gets fired on input box. in ie see message, in chrome not.

well dumb, user error + ie weirdness. in testing entering string input box, input type set "number". seems chrome won't fire alter event if type doesn't match, ie will? either way in ie type whatever heck in box, event fires , see "test message" in console. in chrome have type number , if type string nil happens. please allow me know if i'm misinterpreting behavior.

javascript jquery data-binding

Comments

Popular posts from this blog

php - Edges appear in image after resizing -

ios8 - iOS custom keyboard - preserve state between appearances -

Delphi change the assembly code of a running process -