如何根据点击使用同一个名称标签显示innerhtml？

Question

html

<div name="hhh" class="col-sm-7  new" align="left" >

</div>

javascript

yes.onclick =function()
{
var all = document.getElementsByName("hhh");
    for(var i = 0, max = all.length; i < max; i++) 
        {
            all[i].innerHTML="You have clicked Yes.";

        }
 }


no.onclick =function()
{
var all = document.getElementsByName("hhh");
    for(var i = 0, max = all.length; i < max; i++) 
        {
            all[i].innerHTML="You have clicked No.";

        }
 }

在html中，有两个按钮，分别是“是”和“否”。如果用户单击“是”，将执行yes.onclick（），如果用户单击“否”，则将执行no.onclick（）。 在同一部门中，我必须根据点击显示消息。 但是，如果我编写上面的代码，该消息甚至在单击之前就会显示。 它仅将hhh作为一个名称。 我如何编辑代码，以便根据点击显示消息？ 现在它正在覆盖现有消息。我不想覆盖。我也想显示上一条消息。

Answer 1

<div name="hhhYest" class="col-sm-7" onClick="clickEvent('yes')"  new" align="left" >
</div>
 <div name="hhhNo" class="col-sm-7" onClick="clickEvent('no')"  new" align="left" ></div>

function clickEvent(yesOrNo)
{
//your logic here yesOrNo

 }

Answer 2

如果您只有一个div，则应使用getElementsByTagName（）或更好的方法，应使用getElementById。

您在哪里为js变量分配名称“是”和“否”？ 也许问题是这样的。 如果没有理由通过代码对函数进行动态分配，则也只能定义一个函数

function myError(e){
    var all = document.getElementsByTagName("hhh");
        for(var i = 0, max = all.length; i < max; i++) 
        {
            all[i].innerHTML="You have clicked " + e.value;

        }
}

然后将功能分配给您的按钮

<input type="button" value="yes/no" onClick="myError(this)">

Answer 3

有很多方法可以处理javascript中的点击事件。 似乎您正在尝试设计按钮UI。 您不必解析元素数组，而是选择一个更好的选择器。 HTML中的div元素也没有名称属性，您的all数组为null。

一种显示方法如下所示。

https://jsfiddle.net/699ddkvk/

<div id="hi" style="background-color: red; width:50px; height:50px;" align="left" ></div>
<br>
<div id="ho" style="background-color: blue; width:50px; height:50px;" align="left" ></div>

red = document.getElementById("hi");
blue = document.getElementById("ho");

red.onclick=function(){
   red.innerHTML="YES";
};

blue.onclick=function(){
    blue.innerHTML="YES";
};

Answer 4

 all[i].innerHTML = ... 

all[i].innerHTML += "\n" + ...

而且不要烦躁

white-space: pre-line;

在CSS中。