0

在我网站的测试页面中,这个 js 的文本更改位可以完美运行,但是当我将它带入实际站点时,底部的链接都不起作用。

完全实现的想法是在页面底部有一个导航栏,为页面内容生成 HTML 代码。实际内容本身隐藏在 javascript 字符串中,直到需要为止。然后它被放到页面上的预定位置。

<html>
<head>
<title>Javascript Test #9</title>
<script type="text/javascript">
    window.onload = function() {
        document.getElementById("workl").onclick=workf;
        document.getElementById("aboutl").onclick=aboutf;
        document.getElementById("contactl").onclick=contactf;
        document.getElementById("quote").onclick=quotationf;        
    }

    function workf(){
        document.getElementById("para").innerHTML="Primary Changed Paragraph Content";
        quotationf("changed quote content");
        return false;
    }
    function aboutf(){
        document.getElementById("para").innerHTML="Secondary Changed Paragraph Content<br><br><br>";
        quotationf("changed quote content");

        return false;
    }       
    function contactf(){
        document.getElementById("para").innerHTML="Tertiary Changed Paragraph Content";
        quotationf("changed quote content");

        return false;
    }
    function quotationf (input){
        document.getElementById("quote").innerHTML=input;
        return false;
    }

</script>
</head>
<body>

    <p id="quote"> quote content</p>
    <p id="para">Unchanged Paragraph Content</p>    <br>
<a id="workl" href="#"> Click here to change the paragraph content </a><br>
<a id="aboutl" href="#"> Click here to change the paragraph content </a><br>
<a id="contactl" href="#"> Click here to change the paragraph content </a>

</body>
</html>

代码不起作用在这里:http ://theblankframe.com/tempmobile/index.html

工作测试在这里:http ://theblankframe.com/tempmobile/test2.html

任何帮助都会很棒。谢谢!

4

4 回答 4

0

在生产站点上,我看到了错误

SCRIPT5007:无法设置属性“onclick”的值:对象为空或未定义

在代码行

document.getElementById("workl").onclick=workf;

在测试站点上,您定义一个ID为 workl的A标签

<a id="workl" href="#"> Click here to change the paragraph content </a>

但是,您没有在生产站点上定义这样的标签。

您在生产中的 JavaScript 尝试通过 ID 获取不存在的 ID 的元素,然后对该元素调用无法找到的方法。

于 2012-08-13T18:15:26.670 回答
0

问题出在这里

window.onload = function() {
document.getElementById("workl").onclick=workf; // << error thrown here
document.getElementById("aboutl").onclick=aboutf; //<< aboutl doesnt exist too
document.getElementById("contactl").onclick=contactf;
document.getElementById("quotet").onclick=quotationf;
} 

没有具有 id 的元素,workl因此在对象上附加处理程序null会引发错误,document.getElementById("workl").onclick=workf;并且脚本的其余部分会失败

于 2012-08-13T18:23:30.000 回答
0

@在生产中没有 ID 为“workl”的元素。

一个好的做法是验证 getElementById 是否返回有效的东西。

if(document.getElementById("workl")){
   document.getElementById("workl").onclick=workf;
}
于 2012-08-13T18:23:39.687 回答
0

work1您需要在您的实际站点中有一个带有 id 的元素才能正常工作。这是因为代码

document.getElementById("workl").onclick=workf;

正在寻找它找不到的那个元素。

于 2012-08-13T18:16:45.077 回答