通过javascript动态设置<a>标签内的引导数据切换
Posted
技术标签:
【中文标题】通过javascript动态设置<a>标签内的引导数据切换【英文标题】：Set bootstrap data-toggle inside <a> tag dynamically through javascript 【发布时间】：2021-08-22 07:48:11 【问题描述】：我正在尝试根据输入在选项卡中动态创建数据表，到目前为止，创建数据表和选项卡没有问题。但是，当我单击选项卡时，我无法切换到我想要的数据。像这样手动操作没有问题：
<a href="#tabTable2" data-toggle="tab" class="test"></a>
但是，我想通过 javascript/jquery 添加“data-toggle”属性，但找不到方法。任何人都知道如何克服这个问题或有任何解决方法？
这是我的代码：
var tabHyperLink = document.createElement("a");
tabHyperLink.href = "#tabTable"+x;
tabHyperLink.innerhtml = "Hold "+x;
tabHyperLink.dataToggle = "tab"; //this doesn't work
【问题讨论】：
【参考方案1】：<!DOCTYPE html>
<html>
<head>
<title></title>
<script
src="https://code.jquery.com/jquery-3.6.0.js"
integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
crossorigin="anonymous"
></script>
</head>
<body>
<p></p>
</body>
<script type="text/javascript">
var X = 1;
var anchor = jQuery("p").append("<a></a>");
$(anchor)
.find("a")
.attr( href: "#tabTable" + X, "data-toggle": "tab" )
.html("Hold" + X);
</script>
</html>【讨论】：
以上是关于通过javascript动态设置<a>标签内的引导数据切换的主要内容，如果未能解决你的问题，请参考以下文章