Question

据我所知，jQuery选项卡加载方法只处理单个选项卡索引，如下所示：

.tabs( "load" , index )

连续尝试多个呼叫只会取消之前的呼叫，即：。

.tabs ("load", 2)

.tabs ("load", 3)

tabindex 2的负载被随后的tabindex 3加载取消。

如果没有先前的呼叫被后来的呼叫取消，你如何调用加载方法？

Answer 1

你几乎得到了它。我使用这样的方法和一些AJAX功能来动态地添加标签。

$("#nameOfMyTabsList").tabs("add", "#href-to-my-element"+some_unique_string, "This Is The Link Text!");

这将创建选项卡，以及ID为：

的div

<div id="href-to-my-element">
  //this is where my text is.
</div>

ajax：

$.ajax({
 url: 'location/to/my/file.php',
 data: 'data='+myDataVar,
 success: function(data){
   $("#nameOfMyTabsList").tabs("add", "#href-to-my-element"+some_unique_string, "This Is The Link Text!");
   $("#href-to-my-element"+some_unique_string).html(data);
 }
});

好吧..我们几乎在那里，但我是如何创建独特的动态div？好吧，我们走了：

$("#whatever").click(function(){
  //I had a list of elements, each one had it's own unique name, so I created a variable from my links text when I click.
  var ourTabName = $(this).text;
  //I did some regexp and replacing of unwanted values so there wasn't issues with &, -, and / operators
  var cleanTabName = ourTabName(//do regexp);
  //the data I needed to send to the server is held in my HREF tag. A replace of the hash tag and I'm good to go
  var myDataVar = $(this).attr("href");
  //just a simple removal, nothing fancy
  var myDataVar = myDataVar.replace(/#/g, '');
  //now I can do my ajax. all my variables are set. let's build the new tabs and inject the content.
  $.ajax({
    url: 'location/to/my/file.php',
    data: 'data='+myDataVar,
    success: function(data){
       //This is where pure magic happens. See our cleanName? we're using it again for the dynamic ID tags and Links so we don't run into any issues.
      $("#nameOfMyTabsList").tabs("add", "#href-to-my-element"+cleanTabName, "This Is The Link Text!");
      //now that the link and div have been created, we access the div with the same identifer we just made in the above line. then we append the data that was returned from our ajax request.
      $("#href-to-my-element"+some_unique-string).html(data);
    }
  });
});

这是我用来创建动态标签的解决方案。我不是说它很漂亮（无论如何）;但它是经过100％测试和验证的解决方案。

如何使用jquery选项卡的load方法加载多个选项卡

1 个答案: