Web应用程序的事件监听器最佳实践

Question

我正在制作一个Web应用程序，并且我的JavaScript正在收集相当多的$（document）.on事件监听器。它对我来说工作得不错，但感觉好像有一个更好的方法来组织它。下面是一个示例：

// send quiz info via Ajax, then load form for the first question. 
    $(document).on('click', '#create-new-quiz', function(){ 
     createNewQuiz(); 
     $('#forms').load("dash/workspace.php", { 
      action : 'get-new-question' 
     }); 
    }); 

    // load the form to create the first question 
    $(document).on('click', '#finish-quiz', function(){ 
     addQuestion(); 
     $('#forms').load("dash/workspace.php",{ 
      action : 'finish-quiz' 
     }); 
    }); 

    //call function to add a new question via ajax when the button is clicked. 
    $(document).on('click', '#add-question', function(){ 
     nextAction = "add-question"; 
     addQuestion(); 
    }); 

这表明我有各种各样的动态添加和删除的按钮。当他们被点击时，一个函数被调用。

有什么建议吗？我是否已经走上了正确的道路，还是有更好的方式来组织这个？

Answer 1

我发现$('#button').click(function(){})捷径是整洁的。

而且，你的前两个事件处理程序是相当相似的，可以作出一个更通用一些，即通过一个动作为一个变量：

$('.quizButton').click(function(e){ 
    createNewQuiz(); 
    $('#forms').load("dash/workspace.php", { 
     action : $('this').data('action'); 
    }); 
});