0

我的 Javascript 文件中有以下代码行，我想hide在用户单击链接测试时调用该函数，但是它不会在页面上显示为链接。做什么

document.write('<a href="#" onclick="hide();>test</a>"');

编辑 0

根据这些建议，我使用 document.write 的唯一原因是因为我试图在另一个页面（即接管页面）上显示 HTML。希望有更好的方法来做到这一点。目的是在用户单击“测试”之前，将显示前面的 HTML。当他们点击测试时，前面的 HTML 被隐藏，页面内容正常显示。

function show() {
    obj1 = document.getElementById("container");
    obj1.style.position = "absolute";
    obj1.style.top = "0px";
    obj1.style.left = "0px";
    obj1.style.width = "100%";          
    obj1.style.textAlign = "center";
    obj1.style.zIndex = "9999";
    obj1.style.visibility = "visible";
    obj1.style.display = "inline";
    obj1.style.backgroundColor = "#FFF";
    document.write('<h1>Hello World!</h1><p>Have a nice day!</p>');
    document.write('<a href="#" onclick="hide();">test</a>');

}

function hide() {   
    obj1 = document.getElementById("container");
    obj1.style.display = "none";
    obj1.style.visibility = "hidden";
}

完整代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict/EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtm1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset="UTF-8" />
    <meta http-equiv="content-language" content="en-us" />
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <meta name="copyright" content="&copy; 2012" />

    <title>takeover</title>

    <base href="" />
    <link rel="stylesheet" href="" />

    <style type="text/css" media="all" />

    #container {
         position:absolute;
         text-align:center;
         background-color:#fff;

         z-index:10;
    }

    </style>

    <script type="text/javascript" src="takeover.js"></script>
</head>
<body>
    <div>
        <div id="container">abc</div>
        <p><a href="#">test</a></p>
    </div>

<script type="text/javascript">
     window.onload = show;
</script>
</body>
</html>

编辑 1

好的，在搜索了众多论坛之后，看来 document.write 替换了整个屏幕，因此无法调用适当的 div 元素。相反，我用下面的替换了上面的 javascript，但是我不确定它在哪里是正确的做法。

function show() {
    obj1 = document.getElementById("container").innerHTML ='<p>Hello World.<br>Here I am.</p>';
    obj1 = document.getElementById("container").innerHTML +='<a href="#" onclick="hide();">test</a>';

}

function hide() {   
    obj1 = document.getElementById("container");
     if(obj1)
 {
   alert("Going to hide the element");
   obj1.style.display = "none";
   obj1.style.visibility = "hidden";
 }
 else
 {
   alert("Cannot find the element with id container.");
 }
}
4

3 回答 3

1

我认为你有一个未封闭的报价......试试这个：

document.write('<a href="#" onclick="hide();">test</a>');
于 2012-06-12T02:14:00.480 回答
1

@花生猴子，

继续上述评论。出于某种原因，SO正在吃我的评论。

试试这些

function show() {
    obj1 = document.getElementById("container");
    obj1.style.position = "absolute";
    obj1.style.top = "0px";
    obj1.style.left = "0px";
    obj1.style.width = "100%";          
    obj1.style.textAlign = "center";
    obj1.style.zIndex = "9999";
    obj1.style.visibility = "visible";
    obj1.style.display = "inline";
    obj1.style.backgroundColor = "#FFF";
    document.write('<h1>Hello World!</h1><p>Have a nice day!</p>');
    document.write('<a href="#" onclick="hide();">test</a>');

}

function hide() {   
    obj1 = document.getElementById("container");
 if( obj1)
 {
    alert("Going to hide the element");
   obj1.style.display = "none";
    //obj1.style.visibility = "hidden"; // not required
 }
 else
 {
   alert("Cannot find the element with id container.");
 }
}
于 2012-06-12T03:02:31.423 回答
0

除了使用document.write()，您可以创建一个空元素，例如 div，然后将其 innerHTML 设置为您的链接：

<div id="wrap"></div>
<script language="Javascript">
var wrap = document.getElementById("wrap");
wrap.innerHTML = '<a href="#" onclick="hide();">test</a>';
</script>
于 2012-06-12T02:15:15.103 回答