Question

我使用四个单独的链接构建网站，用其他html的文件信息替换主页的内容。该脚本适用于每个单独的页面，其中单击其他链接会删除该站点的信息，然后单击当前站点的链接时，该信息将重新出现。但我无法使用一个html网站并获得所有四个信息。

HTML：

<div class="tab">
        <button class="tablinks" onclick="openLink(event, 'Home')">Home</button>
        <button class="tablinks" onclick="openLink(event, 'Tickets')">Tickets</button>
        <button class="tablinks" onclick="openLink(event, 'Map')">Map</button>
        <button class="tablinks" onclick="openLink(event, 'Schedule')">Schedule</button>
    </div>

    <div id="Home" class="tabContent"><br>
        <h2 id="person"></h2><br>
        <p>Information and content here </p><br>
    </div>
    <!-- new site information will erase above content and load new page with bottom div -->
    <div id="result" class="tabContent">
    </div>

JS / JQuery的：

$("#result").load("tickets.html #Tickets");
$("#result").load("map.html #Map");
$("#result").load("schedule.html #Schedule");

function openLink(evt, link) {

var i, tabcontent, tablinks;

tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
}

tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
    tablinks[i].className = tablinks[i].className.replace(" active", "");
}

document.getElementById(link).style.display = "block";
evt.currentTarget.className += " active";
}

Answer 1

好的，新代码：

function eachButtons(a,b) {
    var list = document.getElementsByTagName('button');
    for (var i in list) {
        if (list[i].className === a) {
            list[i].onclick = b;
        }
    }
}

怎么用？，看：

eachButtons('class','action');

示例：

HTML：

<body>
    <button className="link">google</button>
    <button className="link">bing</button>
</body>

脚本：

function myfunction() {alert('welcome');}
eachButtons('link',myfunction);

这将为所有带链接classname的按钮发出onclick警报。

错误的代码输入示例：

eachButtons('youclass',youfunction(ThisBacketsAreWrong));

用于将页面上的内容替换为另一个HTML文件的选项卡

1 个答案: