使用javascript：函数语法与jQuery选择器进行Ajax调用

我只有10％的时间做前端开发，我很好奇这是处理ajax调用的更好方法。 这些调用只是将数据发布到指定操作名称和ID的Web应用程序。

set default timezone 
set default timezone 

我这两年都用过，但不确定哪一个更受欢迎。 看起来他们最终会达到同样的目的。 你会认为这些是最好的两种选择，并且比另一种更好吗？

我已经实现了div方法如下：

 $(document).ready(function(){ $('.add-to-list').click(function(){ var id=getId($(this).attr("class")); var action=getAction($(this).attr("class")); $.post('/api/' + action,function(data){ ... },'json') }); }); function getAction(str){ var parts=str.split(' '); var phrase='action-'; for(i=0; i<parts.length; i++){ var val=parts[i].match(phrase); if(val!=null){ var action=parts[i].split('action-'); return action[1]; } } } function getId(piece){ var parts=piece.split('id-'); var frag_id=parts[parts.length-1]; var part_id=frag_id.split('-'); var id=part_id[part_id.length-1]; return id; } 

链接方法看起来很简单。

谢谢

Answer 1

那么第二种方法就是你所谓的Unobtrusive JavaScript 。 它被认为是一种更强大的方法（我将在这里避免使用更好的术语。）

但是，您的实现有点过于复杂。 它可以调整为：

HTML：

 
 set default timezone  

JavaScript的：

 $(document).ready(function () { $('.add-to-list').click(function () { var id = $(this).attr("data-id"); var action = $(this).attr("data-action"); $.post('/api/' + action, function(data) { // ... }, 'json') }); }); 

HTML5规范允许以data-开头的属性承载用户定义的数据。 它也向后兼容（适用于旧版浏览器。）

Answer 2

方法1：

 set default timezone 

方法2：

 
set default timezone 

方法2是首选，因为您可以通过更清晰的标记和脚本代码分离来实践不引人注目的编码风格。 它更容易阅读和调试，并且更易于维护。 此外，我建议不使用CSS类来传递数据，而是使用jQuery.data（）方法在元素上存储数据。