javascript - jQuery Masked Input插件不适用于表单输入吗？

我试图在我的dataTables编辑器字段(#DTE_Field_phone)之一上使用Masked Input插件。由于某些原因，此代码未应用掩码:

$('#DTE_Field_phone').mask('[phone]');

在初始化表和编辑器之后，我要调用掩码，但是什么也没有。对我可能做错的任何想法？

HTML:

<div class="DTE_Field_Input" data-dte-e="input">
    <input id="DTE_Field_phone"></input>
    <div class="DTE_Field_Error" data-dte-e="msg-error" style="display: none;"></div>
    <div class="DTE_Field_Message" data-dte-e="msg-message"></div>
    <div class="DTE_Field_Info" data-dte-e="msg-info"></div>
</div>

jQuery的:

jQuery(function ($) {
    $( document ).ready(function (e) {
        var editor = new $.fn.dataTable.Editor({
            "ajaxUrl": "../wp-content/plugins/contacts/php/table.wp_contacts.php",
            "domTable": "#form_results7",
            "fields": [
                { "label": "Contact",
                  "name": "contact",
                  "type": "text" },
                { "label": "Company",
                  "name": "company",
                  "type": "text" },
                { "label": "Email",
                  "name": "email",
                  "type": "text" },
                { "label": "Phone",
                  "name": "phone",
                  "type": "text" },
                { "label": "Fax",
                  "name": "fax",
                  "type": "text" },
                { "label": "Address",
                  "name": "address",
                  "type": "text" },
                { "label": "Tax ID",
                  "name": "tax_id",
                  "type": "text" }
            ]
        });
        $('#add_items').on('click', function (e) {
            e.preventDefault();
            editor.create(
                'Add Contact',
                {
                    "label": "Add",
                    "fn": function () {
                        editor.submit()
                    }
                }
            );
        });
        $('#form_results7').on('click', 'a.editor_edit', function (e) {
            e.preventDefault();
            editor.edit(
                $(this).parents('tr')[0],
                'Edit Contact',
                { "label": "Update", "fn": function () { editor.submit() } }
            );
        });
        $('#form_results7').on('click', 'a.editor_remove', function (e) {
            e.preventDefault();
            editor.message( "Are you sure you want to remove this row?" );
            editor.remove( $(this).parents('tr')[0], 'Delete row', {
                "label": "Confirm",
                "fn": function () { this.submit(); }
            });
        });
        var oTable = $('#form_results7').dataTable({
            "bAutoWidth": false,
            "bJQueryUI": true,
            "sAjaxSource": "../wp-content/plugins/contacts/php/table.wp_contacts.php",
            "sDom": "<'H'lfr>t<'F'ip>",
            "aoColumns": [
                { "mData": "contact",
                  "sWidth": "14%" },
                { "mData": "company",
                  "sWidth": "14%" },
                { "mData": "email",
                  "sWidth": "17%" },
                { "mData": "phone",
                  "sWidth": "11%" },
                { "mData": "fax",
                  "sWidth": "11%" },
                { "mData": "address",
                  "sWidth": "17%" },
                { "mData": "tax_id",
                  "sWidth": "8%" },
                { "bSortable": false,
                  "mData": null,
                  "sClass": "center",
                  "sDefaultContent": '<a href="" class="editor_edit">Edit</a> | <a href="" class="editor_remove">Delete</a>',
                  "sWidth": "8%" }
            ],
            "sPaginationType": "full_numbers"
        });
        $('#DTE_Field_phone').mask("[phone]");
        try {$("#form_results7_length select").msDropDown();} catch(e) {alert(e.message);}
        $('#refresh_items').click(function() {
            location.reload();
        });
        $("#reset").click(function() {
            $("#form_results7_filter input").val("");
            oTable.fnFilter("");
            oTable.fnSort([[ 0, "asc" ]]);
        });
    });
});

最佳答案

我没有dataTables的经验，但是从您的代码中，我认为您正在使用弹出编辑器？
如果是这样，您可能需要在打开编辑器后触发的事件中应用 mask ，如下所示:

editor.on('onOpen', function () {
    $('#DTE_Field_phone').mask('[phone]');
});