Javascript ajax加载后加载容器事件 #

更新：见问题末尾的答案

# 我遇到以下问题：

我创建了一个函数来加载在特定事件上加载的所有事件/插件。当页面最初加载时，在“body”上加载，当进行ajax调用时，将调用加载内容的容器

(function($){
    $.fn.defaultFormValues = function(){
        return this.each(function(){
            var element = $(this);

            var defaultValue = element.attr("default");
            var currentValue = element.val();

            // This will make sure not to replace exisitng values
            if( !currentValue ) {
                element.val( defaultValue ).addClass('input-before-focus');
            }
            else if( currentValue == defaultValue ) {
                element.addClass('input-before-focus');
            }

            element.unbind('focus').bind('focus', function() {
                if( element.val() == defaultValue ) {
                    element.val('').removeClass('input-before-focus');
                }
            });

            element.unbind('blur').bind('blur', function() {
                var currentVal = element.val();

                if( currentVal == '' ) {
                    element.val(defaultValue).addClass('input-before-focus');
                }
            });
        }); // end function
    };
})( jQuery );

(function($){
    $.fn.loadEvents = function(){
        return this.each(function(){

            var containerObj = $(this);

            $("input[default], textarea[default]",containerObj).defaultFormValues();
        });
    };
})( jQuery );

我加载初始调用，如下所示：

$("body").loadEvents();

加载ajax容器时，它会加载如下事件：

container.loadEvents();

---

由于某些原因，这些事件不适用于ajax调用

任何帮助都将不胜感激

亚历山大

• • • • 答复

好的，我能找出问题所在。每当您使用container.replaceWith（…）时，对元素“container”的引用将不再可用，因为它已被删除并替换为该元素的新实例

这是一个逻辑项目，我只是错过了，以防任何人遇到同样的问题

---

Alexander

如果使用

load（）

或其他插入方法添加新元素，则需要在插入这些元素后调用方法

最简单的情况是

$('#content').load('path/to/server',function(){
/* new content exists, can bind event handlers to it*/
  $(this).loadEvents()
});

---

何时何地调用

defaultFormValues

？