Html onClick 文本更改
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17064304/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
onClick text change
提问by Jurjen van Genugten
so I'm pretty new with html and need some help.
所以我对 html 很陌生，需要一些帮助。
I'm trying to make 3 buttons and each of them will change the text next to when you click on them. I am using the following code for each button:
我正在尝试制作 3 个按钮，当您单击它们时，每个按钮都会更改旁边的文本。我为每个按钮使用以下代码：
<a href="#" onClick="document.getElementById('past').innerHTML='---future---';">
When I click on the button the text will change in the text after the innerHTML=" ". The problem is that one I add to much text on the places ---future--- it won't load it anymore in the browser. The screen just won't update. How do I overcome this problem? I've been having this problem for quite some time so any help will be appriciated.
当我单击按钮时，文本将在 innerHTML="" 之后的文本中更改。问题是我在这些地方添加了很多文本---未来---它不会再在浏览器中加载它。屏幕只是不会更新。我如何克服这个问题？我遇到这个问题已经有一段时间了，所以任何帮助都会得到帮助。
回答by Divyam Solanki
<script>
function changeText()
{
document.getElementById('boldStuff').innerHTML = 'Fred Flinstone';
}
</script>
<p>Welcome to the site <b id='boldStuff'>dude</b> </p>
<input type='button' onclick='changeText()' value='Change Text'/>
</body>
</html>
Try This Code. It Works For Me. In The Above Code I Have Used [bold] tag To Focus It You Can Use Acronym Tag.
试试这个代码。这个对我有用。在上面的代码中，我使用了 [bold] 标签来聚焦它，您可以使用 Acronym 标签。
回答by Mohammad Areeb Siddiqui
<p id="peep"></p>
<button onclick="myFunction('Harry Potter')">Click for Harry Potter</button>
<button onclick="myFunction('Bob')">Click for Bob</button>
<script>
function myFunction(name)
{
document.getElementById("peep").innerHTML = "Welcome " + name;
}
</script>
Use the same function on all buttons to change the text!
在所有按钮上使用相同的功能来更改文本！
Check this fiddle.
检查这个小提琴。
回答by Bal mukund kumar
Use this code:
使用此代码：
HTML:
HTML：
<h1> Welcome to the </h2><span id="future-clicked"></span>
<button onclick="clicked_on()">Click for future</button>
JS:
JS：
<script>
function clicked_on(){
document.getElementById('future-clicked').innerHTML = 'Future World';
}
回答by M. Lak
Try this to change text on click the text:
尝试通过单击文本更改文本：
<div id="chgtext">This is my current text</div>
<a href="#" onclick="document.getElementById('chgtext').innerHTML='Change the text using javascript';">Change text</a>
<a href="#" onclick="document.getElementById('chgtext').innerHTML='Text will be changed based on the other text';">Change text2</a>
<a href="#" onclick="document.getElementById('chgtext').innerHTML='This is another sample changed text on click the onther text';">Change text3</a>
</div>
Here is the demo
这是演示
