Javascript 单击按钮时，如何将style.display从无更改为内联？

单击按钮时，我想显示

id=“text”

。所以我试了一下：

    <form name="i_choose_form" action="" method="post">
      <input type="submit" class="button" value="I am not sure, show me other choices..." onclick = "showText()"></br>
    </form>

    <span id ="text" style="display:none">First make your choice then you can see all other choices</span>

    <script type = "text/javascript">

function showText() { document.getElementById("text").style.display="inline"; }

</script>

首先做出选择，然后才能看到所有其他选择
函数showText（）{document.getElementById（“text”）.style.display=“inline”}

---

但这并没有像预期的那样工作，文本也不会显示。我做错了什么

您的表单似乎干扰了所需的结果，请尝试以下操作：

<div onclick = "showText()">Click me</div>

点击我

您没有取消提交按钮的单击事件，因此页面将提交表单

onclick = "showText(); return false;"

您应该真正考虑添加事件

函数showText（）{
document.getElementById（“text”）.style.display=“inline”；
}
document.getElementById（“showMore”）。单击=showText；

问题在于如何设置JSFIDLE。左侧是一个下拉列表，用于选择站点如何将JavaScript合并到结果页面中。将其设置为“无包裹（头部）”即可工作。实际上，它不起作用，但它会调用你的函数

---

下一个问题是，“提交”按钮将在处理程序运行后立即提交表单。要防止这种情况发生，您需要停止事件传播。

它会显示出来，但您正在提交页面。将输入更改为type='button'而不是'submit'

<input type="button" class="button" value="I am not sure, show me other choices..." onclick = "showText()"></br>

我尝试了这个方法，但它似乎仍在刷新页面，因为您没有正确复制示例

onclick=“showText（）”返回false

应该是

onclick=“showText（）；return false；”

对不起，现在它可以工作了。谢谢将“提交”更改为“按钮”和此版本都有效。是否有理由选择其中一个而不是另一个？将帖子提交回表单，按钮没有。谢谢，这很有效。我还通过Pointy的回答更改了JFIDLE设置

<input type="button" class="button" value="I am not sure, show me other choices..." onclick = "showText()"></br>