Comment puis-je imposer une saisie monétaire dans un input ?

Index

Mettre le code en vrac dans l'objet App comme ci-dessous n'est pas une bonne idée. Pour un page complexe, cela deviendra très vite un fouillis inextricable.

var App = ( function( $, W ){
        
        var jObjForm = $( "#monFormID" ),
            jObjInputText = jObjForm.find( "input[type='text']" ),
            jObjSubmit = jObjForm.find( "input[type='submit']" ),
            inputTextKeyupHandler = function(){
                if ( $( this ).is( ":valid" ) ){
                    jObjSubmit.css( "display", "block" );
                } else {
                    jObjSubmit.css( "display", "none" );
                }
            },
            formSubmitHandler = function(){
                console.log( "Le formulaire est valide !" );
                
                return false; // empêche la transmission du formulaire
            };
        
        return {
            "ready" : function(){
                
                jObjInputText.on( "keyup", inputTextKeyupHandler );
                
                jObjForm.on( "submit", formSubmitHandler );
            }
        };
    })( jQuery, window );
    
    $( App.ready );

});

Vous devez grouper vos codes concernant une même cible en créant un objet, ci-dessous l'objet Form.

var App = ( function( $, W ){
    
    var jObjForm = $( "#monFormID" ),
        jObjInputText = jObjForm.find( "input[type='text']" ),
        jObjSubmit = jObjForm.find( "input[type='submit']" );
        
    var Form = {
        "init" : function(){
            jObjInputText.on( "keyup", Form.inputTextKeyupHandler );
            jObjForm.on( "submit", Form.submitHandler );
        },
        "inputTextKeyupHandler" : function(){
            if ( $( this ).is( ":valid" ) ){
                jObjSubmit.css( "display", "block" );
            } else {
                jObjSubmit.css( "display", "none" );
            }
        },
        "submitHandler" : function(){
            console.log( "Le formulaire est valide !" );
            
            return false; // empêche la transmission du formulaire
        }
        
    };
    
    return {
        "ready" : function(){
            
            Form.init();
            
        }
    };
})( jQuery, window );

$( App.ready );

Pour aérer le code, il faut mettre chaque objet autonome dans un fichier séparé.

Fichier Form.js :
    
var jObjForm = $( "#monFormID" ),
    jObjInputText = jObjForm.find( "input[type='text']" ),
    jObjSubmit = jObjForm.find( "input[type='submit']" ),
    Form = {
        "init" : function(){
            jObjInputText.on( "keyup", Form.inputTextKeyupHandler );
            jObjForm.on( "submit", Form.submitHandler );
        },
        "inputTextKeyupHandler" : function(){
            if ( $( this ).is( ":valid" ) ){
                jObjSubmit.css( "display", "block" );
            } else {
                jObjSubmit.css( "display", "none" );
            }
        },
        "submitHandler" : function(){
            console.log( "Le formulaire est valide !" );
            
            return false; // empêche la transmission du formulaire
        }
    };
Fichier faq.js :

var App = ( function( $, W ){
            
    return {
        "ready" : function(){
            
            Form.init();
            
        }
    };
})( jQuery, window );

$( App.ready );

Tests unitaires avec QUnit.