jquery заменить .live .on

Question

Я понятия не имею, почему моя кнопка закрытия не будет работать. Я пробовал с .close, #login-box, #btn_close, .btn_close, , .login-box и т.д. спасибо. Извините, если я задаю такой вопрос, jQuery для меня новый.

$(document).ready(function() { 
    $(window).load(function() { 
     // Getting the variable's value from a link 
     var loginBox = $(this).attr('href'); 

     //Fade in the Popup and add close button 
     $('#login-box').fadeIn(300); 

     //Set the center alignment padding + border 
     var popMargTop = ($('#login-box').height() + 24)/2; 
     var popMargLeft = ($('#login-box').width() + 24)/2; 

     $('#login-box').css({ 
      'margin-top': -popMargTop, 
      'margin-left': -popMargLeft 
     }); 

     // Add the mask to body 
     $('body').append('<div id="mask"></div>'); 
     $('#mask').fadeIn(300); 

     return false; 
    }); 

    // When clicking on the button close or the mask layer the popup closed 
    $('body').on('click', '.close', function) { 
     $('#mask , .login-popup').fadeOut(300, function() { 
      $('#mask').remove(); 
     }); 
     return false; 
    }); 
}); 

<div id="login-box" class="login-popup"> 
    <a href="#" class="close"><img src="close_pop.png" class="btn_close" title="Close Window" alt="Close" id="close" /></a> 
    <a class="forgot" href="#">Forgot your password?</a> 
</div> 

Answer 1

Там есть синтаксическая ошибка в обработчике щелчка

Этот код ...

// When clicking on the button close or the mask layer the popup closed 
$('body').on('click', '.close', function) { 
    $('#mask , .login-popup').fadeOut(300, function() { 
     $('#mask').remove(); 
    }); 
    return false; 
}); 

Должно быть

// When clicking on the button close or the mask layer the popup closed 
$('body').on('click', '.close', function(e) { // <-- pay attention here 
    $('#mask , .login-popup').fadeOut(300, function() { 
     $('#mask').remove(); 
    }); 
    return false; 
}); 

Совет: рассмотреть также используя e.preventDefault(), чтобы отключить поведение по умолчанию

$('body').on('click', '.close', function(e) { 
    e.preventDefault(); // <-- right here 

    $('#mask , .login-popup').fadeOut(300, function() { 
     $('#mask').remove(); 
    }); 
}); 

Answer 2

у вас есть ошибка синтаксиса, отсутствует (

$('body').on('click', '.close', function) { 
    // code removed for clarity 
}); 

Должно быть:

$('body').on('click', '.close', function() { 
             //^ missing brace  
}); 

Обязательно проверьте консоль браузера на наличие ошибок. Вы должны увидеть ошибку синтаксиса выброшен