jQuery UI选项卡：如何使用发布数据发送ajax请求？

从jQuery UI选项卡 ：

 $(function() { $( "#tabs" ).tabs({ ajaxOptions: { error: function( xhr, status, index, anchor ) { $( anchor.hash ).html("Couldn't load this tab."); } } }); });  
 
 
 
Preloaded
 
Tab 1
 
Tab 2
 
 
 
Proin elit arcu, rutrum commodo.
  

在这种情况下如何发送带有post数据的ajax请求 （可能通过ajaxOptions）。

我不知道如何修改标签url以发送post数据，例如：

 
Tab 1
 
Tab 1 

谢谢！

编辑 ：

在jQuery中它是：

 $.load("some_url",{country: countryValue}); 

所以我有post标题（国家）和post值（countryValue）。 如何对每个标签执行相同的操作？

Answer 1

要使AJAX方法POST，可以向ajaxOptions对象添加type 。 要收集post的数据，您可以利用jQuery.data()然后隐藏锚点中的POST参数。

 
 
 
Preloaded
 
Tab 1
 
Tab 2
 
Tab 3 (slow)
 
Tab 4 (broken)
 
 
 
Proin elit arcu, rutrum commodo.
  

和JavaScript：

 var postData = {}; $("#tabs").tabs({ select: function(event, ui) { postData = { country: parseInt($(ui.tab).data('country')), city: parseInt($(ui.tab).data('city')); }; }, ajaxOptions: { type: 'POST', data: postData, error: function(xhr, status, index, anchor) { $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. " + "If this wouldn't be a demo."); } } }); 

试试吧： JSFiddle

如果您的参数对每个链接都有所改变，那么您必须想出一种方法来了解您正在寻找的参数。 您可以使用ui.index获取select()事件中选项卡的索引，并使用switch为每种情况获取不同的参数。 不可否认，这个解决方案不是很漂亮，但它可以工作。