Ajax 加载内容的 JQuery 事件绑定

Question

我正在尝试让 JQuery 通过带有事件绑定的 ajax 处理动态加载的内容，类似于：Event binding on dynamically created elements?

但是，我对 java/Jquery 不太擅长，而且我似乎无法让 jquery 处理 ajax 内容。我从这段代码开始：

(function($){
function floatLabel(inputType){
        $(inputType).each(function(){
            var $this = $(this);
            var text_value = $(this).val();

            // on focus add class "active" to label
            $this.focus(function(){
                $this.next().addClass("active");
            });

            // on blur check field and remove class if needed
            $this.blur(function(){
                if($this.val() === '' || $this.val() === 'blank'){
                    $this.next().removeClass();
                    }
            });

            // Check input values on postback and add class "active" if value exists
            if(text_value!==''){
                $this.next().addClass("active");
                }
            });
    // Automatically remove floatLabel class from select input on load
    //$( "select" ).next().removeClass();
}
// Add a class of "floatLabel" to the input field
floatLabel(".floatLabel");
});

我尝试像这样绑定事件：

(function($){
    var $this = $('.floatLabel');
    var text_value = $('.floatLabel').val();
$('.container').on('focus', '.floatLabel', function floatLabel(inputType){
    $(inputType).each(function(){
        $this.next().addClass('active');
        if(text_value!==''){
            $this.next().addClass('active');
        }
    });
});
$('.container').on('blur', '.floatLabel', function floatLabel(inputType){
        $(inputType).each(function(){
            if($this.val() === '' || $this.val() === 'blank'){
                $this.next().removeClass();
        }
        });
    });
})(jQuery);

这是主要的html页面：

<div class="container">
   <div id="ha">
     <script type="text/javascript">
      $( document ).ready(function() {
      $('#ha').load('example.com/createform');
});
     </script>
   </div>
</div>

已加载内容：

<div >
 <input class="floatLabel" name="example">
 <label for="example">example</label>
</div>

Answer 1

这似乎可以通过$(document).ajaxComplete (function (){ 解决，只需复制原始代码即可。感谢大家的帮助！