0

嗨我有这个代码

html代码

<ul>
<input type="button" onclick="appear()"/>
<li id="addQuestionChoices">roma</li>
</ul>

CSS代码

#addQuestionChoices{display:none;}

javascript代码

function appear()
{document.getElementById('addQuestionChoices').style.display="block";}

但是当我按下按钮时，什么也没有发生，是 javascript 不适用于 LI 标签吗？要不然是啥 ？谢谢你的回答

4

5 回答 5

5

<li>标记必须在or<ul>内<ol>，并且唯一允许的子级<ul>和<ol>是<li>标记。这意味着您<input>应该在以下范围之外<ul>：

<input type="button" onclick="appear()"/>
<ul>
    <li id="addQuestionChoices">roma</li>
</ul>
于 2012-05-08T15:56:19.113 回答
2

只要确保在之前定义函数，就像在这个小提琴中一样：http: //jsfiddle.net/2dUfa/

<script>
function appear() {
    document.getElementById('addQuestionChoices').style.display= "block";
}
</script>
<input type="button" onclick="appear()" value="appear" />

<ul>
   <li id="addQuestionChoices">roma</li>
</ul>

作为旁注：<li>元素的默认显示属性是list-item（而不是block）

于 2012-05-08T16:10:24.800 回答
1

尝试将a or标签放在<li>里面。<ol><ul>

于 2012-05-08T15:57:22.630 回答
1

在 HTML 中嵌入 JavaScript 调用是不好的做法。当功能、样式和标记分开时，它使代码更易于维护。其次，您的<li>元素应该嵌套在一对<ul>或<ol>标签中。

我写了一个 jsFiddle 示例，说明如何处理此任务：

http://jsfiddle.net/dLqja/1/

在这段代码中，我创建了一个“点击”侦听器，它通过它的 id 附加到您的按钮。按下按钮后，它会触发一个匿名回调函数，该函数会动态更改“li”元素的显示样式。

包含 jQuery

使以下内容成为您在页面中包含的第一个 JavaScript。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

这个 jQuery 脚本由谷歌托管，它有它的优点，例如（它可能已经缓存在客户端浏览器中，因为它访问了以前使用它的网站）。

您编写的任何使用 jQuery 功能的 JavaScript 代码都应包含在上述脚本之后。

无 jQuery 版本...

您可以通过为按钮分配事件侦听器来实现与上述类似的结果。这种方法比使用 onclick="..." 更可取，因为它坚持将功能与标记分开的规则。如果这些答案都不起作用，您应该检查浏览器控制台是否有错误消息。 http://jsfiddle.net/SvufY/1/

于 2012-05-08T16:04:39.033 回答
1

您应该避免使用内联 Javascript 代码，而是专注于将其分开。将您的事件处理程序附加到脚本标记中的对象（或者，更好的是，在文档末尾加载的脚本文件），如下所示：

<input id="clickButton" type="button" value="submit" />
    <ul>
        <li id="addQuestionChoices">roma</li>
    </ul>

<script>
    document.getElementById('clickButton').onclick = function() {
        document.getElementById('addQuestionChoices').style.display="block"
    };
</script>

您可以在http://jsfiddle.net/xxgdB/看到一个工作示例

另请注意，您可以使用其中一个list-item或inherit在显示字段中来实现相同的效果。

于 2012-05-08T16:09:57.640 回答