0

所以我对对象文字模式非常陌生，但对这种模式及其提供的组织感到非常兴奋。

我正在尝试做的是即时更新电话号码表单字段以格式化为用户类型（###-###-####）。但是，我想让格式化功能成为一种可重用的实用程序，这样我就可以将它相应地分配给其他输入，而无需每次都重写函数的功能......一直在尝试使用 Object Literal 模式

我有一个小提琴设置http://jsfiddle.net/JF3Vh/3/

到目前为止，这是我所拥有的……谨慎学习正在进行中……

HTML

<div id="contactPage">
  <form>

    <label id="lblPhone" for="txtPhone">Your Phone Number:</label>
    <input id="txtPhone" name="phone" type="tel"/>                      

  </form>
</div>

使用 jQuery 的 JavaScript

var appMobile = {

    utilities: {

        formatPhone : function(){
            alert( "formatPhone is running" );
            $( this ).val().replace(/(\d{3})(\d{3})(\d{4})/, "$1-$2-$3");
        }

    },
    page: {
    home : {function()
       //Some Page specific functions here
    },
    contactForm: function () {
            $( '#txtPhone' ).onchange(function() {
                $(this).appMobile.utilities.formatPhone();
            });
        },
    products : {function()
       //Some Page specific functions here
    },


    }


};


$( document ).ready( function () {

    /*--initialize Scheduling page function--*/
    if ( $( '#contactPage' ) ) { appMobile.page.contactForm(); }

} );

让我直截了当，谢谢！:)

WizzyBoom

4

1 回答 1

0

我相信这就是你想要的：

var appMobile = {
    utilities: {
        formatPhone: function(){
            alert( "formatPhone is running" );
            $( this ).val().replace(/(\d{3})(\d{3})(\d{4})/, "$1-$2-$3");
        }
    },
    page: {
        home: function() {
           //Some Page specific functions here
        },
        contactForm: function () {
            $('#txtPhone').on('change', appMobile.utilities.formatPhone);
        },
        products: function() {}
           //Some Page specific functions here
        }
    }
};

$(function () {
    if ($('#contactPage').length) { 
        appMobile.page.contactForm(); 
    }
});

此外，您可能对这个蒙面编辑插件感兴趣。

于 2013-01-08T21:16:20.320 回答