Question

我在javascript中有这个功能，如下所示：

function getlivefeed() 
{       
    var msglist = document.getElementById("updates");
    var type = msglist.getAttribute("data-id-type");        

    var response = $.ajax({ type: "GET",   url: "iterations/live.php?type=" + type + "&token=" + Math.random(),   async: false }).responseText;     
    if (response != "undefined")
        document.getElementById("updates").innerHTML = response;                                        
}

正如您所看到的，此函数查看div数据属性并读取该值并在ajax调用中使用该值。

当我更改标签的索引时，我希望能够以某种方式更改此属性。

该选项卡是一个引导标签控件。

标签的标记是：

<ul class="nav nav-tabs">
  <li class="active"><a href="#atlass" data-toggle="tab">Atlass</a></li>
  <li><a href="#avi" data-toggle="tab">Aviation</a></li>
  <li><a href="#proc" data-toggle="tab">Processing</a></li>
  <li><a href="#it" data-toggle="tab">IT&S</a></li>
</ul>

<div class="tab-content">
  <div class="tab-pane active" id="atlass"><div id="updates" data-id-type="1"><div class="alert alert-default well" style="background-color: #f1f1f1"><i class="fa fa-spinner fa-spin"></i> Portal is Initilizing... Please Wait.</div></div></div>
  <div class="tab-pane" id="avi"><div class="well" style="background-color: lightsteelblue;">Aviation Feed Will go here.</div></div>
  <div class="tab-pane" id="proc"><div class="well" style="background-color: lightsteelblue;">Processing Feed Will go here.</div></div>
  <div class="tab-pane" id="it"><div class="well" style="background-color: lightsteelblue;">IT&S Feed will go here.</div></div>
</div>

总的来说，我的问题是，当我更改标签的索引时，如何让我的功能使用不同的“类型”iterations/live.php?type=1 or type = 2 or type = 3等？

非常感谢！

Answer 1

据我了解你的问题，你想改变数据属性的值吗？

您可以使用jQuery的数据功能来更改数据属性..

$("#atlass").data("id-type",2);

切换标签时触发脚本：

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
  e.target // activated tab
  e.relatedTarget // previous tab
 // your logic here...
})

此代码实际执行的操作：选项卡链接已绑定。每当用户点击tab元素时，此脚本将触发..

bootstrap选项卡选择以确定ajax调用

1 个答案: