0

我的网络应用程序的非 ajax 版本很好，因为事件是按我想要的顺序添加的，并且所有事件都添加到有问题的手机元素上。

但是对于我的 ajax 应用程序，由于元素是动态获取的，因此事件是“不同地”添加的，所以我有相同的事件，但实际上是在不同的元素上（#container用于检查动态添加的元素，以及直接应用于的掩码.input-cell-phone）。

例如，当用户键入无效 (215)-###-#### 时，我希望 Masked Input 在我的模糊代码之前将其清除，但事实并非如此。这里基本上是“ajax”应用程序（减去 ajax 调用，我用 模拟它.append）：http:
//jsfiddle.net/armyofda12mnkeys/9DGgF/

这是像我期望的那样工作的非 ajax 版本：http:
//jsfiddle.net/armyofda12mnkeys/XKf8d/2/

任何想法如何让它发挥作用？

4

1 回答 1

0

我想出只是在下面这样做。因此，当我专注于输入时，如果尚未添加插件，我会动态添加事件。我的应用程序中的事件排序存在问题。所以我确保先添加蒙版，然后添加模糊事件。

$('#container').on('focusin', '.input-phone', function() {
    var $this = $(this);
    if( (typeof $this.data()['rawMaskFn'] !== "function") ) {
        //dynamically adds the mask plugin
        $this.mask("(999)-999-9999"); //probably adds a blur event

        //make sure its the first thing in blur event
        if($this.hasClass('input-cell-phone')) { //********* moved here so this blur event can get added after the above event

            $('.input-cell-phone').blur(function() {//on() way doesnt work here for some reason
                //if clear cell phone, make sure to clear daytime phone
                var phone_val = $.trim($(this).val());
                if(phone_val==""){
                    //find daytime equivilent and clear too
                    $(this).parents('.container').find('input.input-day-phone').val('');
                }
            });
        }
    }
});
于 2012-04-10T20:17:18.090 回答