Question

我在index.php文件

中包含了一个名为test.php的文件

让我们假设index.php就像这样

<html>
<head>
</head>
<body>
<h1 id="dash">Index</h1>

<div id='tab.php'>

<?php include('tab.php'); ?>


</div>
</body>
</html>

和tab.php就像这样

<html>
<head>
</head>
<body>
<ul>

<li id='date' onClick="change_head(this.id);">Dates</li>

<li id='appoint' onClick="change_head(this.id);">Appointments</li>

<ul>
</body>
</html>

我想要做的是，如果单击列表项日期（列表项实际上是制表符）。具有id破折号的h1标签的内部html应更改为日期，如果单击列表项指定，则具有id破折号的相同h1标签的内部html应更改为约会。

我该怎么做？我尝试了通常的javascript方式，通过使用id并应用if条件来更改innerHTML但它不起作用。任何人请帮我怎么做

JAVASCRIPT（这是js我试图实现它...我在index.php中添加了这个）

    function change_head(id){

    dash = document.getElementById('dash').innerHTML;

    if(id == date){

    dash = "Date";


    }
    else if(id == appoint){

    dash = "Appointment";

    }
    else{
    dash = "Index";
    }

}

Answer 1

您可以尝试使用jquery ......这样的事情：

<script type="text/javascript">

$(document).ready(function () {
    $("li#date").click(function () {
        $("h1#dash").val("Dates");
    });
    $("li#appoint").click(function () {
        $("h1#dash").val("Appointments");
    });
});

</script>

当然，如果你有更多这些标签，我会为所有“li”元素创建一个单击事件处理程序并打开ID： - ）

假设您是jquery的新手，您还必须在页面中包含jquery脚本。类似的东西：

<script src="/Scripts/jquery-1.6.4.min.js" type="text/javascript"></script>

查看jquery.com开始使用。

Answer 2

如果你想用JavaScript（即没有重新加载页面），那么你需要使用DOM innerHTML。

有点像（如果你没有使用jQuery），没有测试这段代码，希望你明白：

var changetext = function(e,t) {
  e.innerHTML = t;
},
    elemheader = document.getElementById('dash'),
    elemdate = document.getElementById('date'),
    elemappoint = document.getElementById('appoint');

if (elemdate.addEventListener) {
    elemdate.addEventListener('click',changetext(elemheader,'Date'),false);
}

if (elemappoint.addEventListener) {
    elemappoint.addEventListener('click',changetext(elemheader,'Appoint'),false);
}

如何根据包含页面中的div值更改主页面中div的innerHTML？

JAVASCRIPT（这是js我试图实现它...我在index.php中添加了这个）

2 个答案: