Question

第一次点击它时，jQuery错误框不会出现。当我第二次再次点击进入时。

$(document).ready(function() {  

jQuery.validator.addMethod("file", function( value, element ) {
                var ext = value.substring(value.lastIndexOf('.') + 1);
                var result = this.optional(element) || ext == "csv" || ext == "CSV";
                return result;
        }, '<div class="errorbox rateError"><div class="error-message">* Please upload only csv file</div><div class="error-arrow"></div></div>');
var $Zone = $('#ZoneZone').attr('name');

var $params = {debug:false,rules:{},messages:{}};

$params['rules'][$Zone] = {"required": true};
$params['messages'][$Zone] = {"required":'<div class="errorbox rateError"><div class="error-message">* Please enter Zone</div><div class="error-arrow"></div></div>'
};

 $("#ZoneAdminAddForm").validate($params);

jQuery(document).on('click','.errorbox',function(){
        alert("click");
        $(this).fadeOut('slow',function(){
            $(this).remove();
        });                                  
    });

});

当我第一次点击错误框时没有发生任何事情，但是当我再次点击它第二次发出提示点击并且该错误信息正在进行时。

我试图不提供任何冲突代码，但它无效。

相同的代码在其他页面中有效。

Answer 1

.on（）适用于jQuery 1.7及更高版本。如果您使用的是旧版本，请使用：

$('.errorbox').live('click',function(){
        $(this).fadeOut('slow',function(){
                $(this).remove();
        });                                  
    });


   $('.errorbox').live('focus', function()
    {
        $(this).fadeOut('slow',function(){
        $(this).remove();        
        });
    });

Answer 2

使用on代替live并将代码包装在document.ready中。我怀疑当此代码首次尝试绑定事件处理程序时，不会加载dom元素。 {I}方法已被弃用了一段时间，并且首选live方法，它使用事件传递将事件处理程序分配给当前未在DOM上呈现的元素。

on

第一次点击它时，jQuery错误框不会出现。当我再次点击它第二次它

2 个答案: