jQuery和数据属性来处理所有的Ajax调用？

我想通过在属性的链接上启用ajax来减少javascript代码的数量。例如：jQuery和数据属性来处理所有的Ajax调用？

<a href="/Default/Link.html" data-endpoint="/Ajax/Link.html" rel="targetId" async="true">Click me!</a>

async="true"将禁用链路（href）的默认行为，以及使用该data-endpoint值做一个AJAX调用，并将其插入到在rel定义的元素的id。

我不是JS专家，所以我会很感激使用这种方法的任何想法或陷阱。诸如cache：true等选项对于能够传入也很酷，但并非真正需要，因为我希望这样做以获得包含更多或更少实时数据的部分视图（不需要缓存）。

来源

2011-08-02 olemarius

看看这里的灵感http://www.pluralsight-training.net/microsoft/players/PSODPlayer.aspx?author=scott-allen&name=mvc3-building-ajax&mode=live&clip=0&course=aspdotnet-mvc3-intro （你对这个链接上的“不显眼的javascript”部分感兴趣），你也可以扩展他们的代码http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.unobtrusive-ajax.js –

这就是我一直在寻找:-)如果这可以在Castle MonoRails MVC中使用，那就完美了:) – olemarius

像这样的事情

（这是从一个演讲中，我看到了在Facebook上如何尽量减少他们的代码，他们怎么优化都记录下来，以每一位“N字节的启发，但可能是非常简单的比） HTML

<a href="/Default/Link.html" 
    data-endpoint="/Ajax/Link.html" 
    data-target="targetId" 
    data-cache="false", 
    data-async="true">Click me!</a>

jQuery的

$('a[data-async="true"]').click(function(e){ 
    e.preventDefault(); 
    var self = $(this), 
     url = self.data('endpoint'), 
     target = self.data('target'), 
     cache = self.data('cache'); 

    $.ajax({ 
     url: url, 
     cache : cache, 
     success: function(data){ 
         if (target !== 'undefined'){ 
          $('#'+target).html(data); 
         } 
       } 
    }); 
});

来源

2011-08-02 07:40:59

jQuery和数据属性来处理所有的Ajax调用？

回答

相关问题