无法在Javascript中单击标签

Not able to click on Label in Javascript

本文关键字：单击 标签 Javascript      更新时间：2023-09-26

我试图点击标签，但无法点击。这是我的代码：

 function nameToggle(){              
                 var NameInput = get("nameInput");  
                 var labelName = nameInput.getLabel();
                 alert(labelName);
                 labelName.onclick = showAlert;                         
            } 
             function showAlert(){
                 alert("onclick Event Detected");
             }

这是我的html:

<div id="nameShow">
    <div  style="margin: 36px 0 0 50px;">
            <input id="nameInput"  label="Name"  onkeydown="namesFunction()"/>                  
    </div>
</div>

在输入中，我想onkeydown调用namesfunction，它工作得很好，但当点击标签（Name）时，我想切换。我正在另一个函数中调用nameToggle。但我无法点击"姓名"。我没有使用jQuery。只有Javascript。感谢您的帮助。

1）在函数nameToggle()中，您已将onclick分配给labelName，但这是一个字符串（"Name"）。将onclick分配给NameInput，它是元素：

function nameToggle(){
    var NameInput = document.getElementById("nameInput");
    var labelName = nameInput.getLabel();
    alert(labelName);
    NameInput.onclick = showAlert; // <---                    
}

2） 由于您在函数内进行onclick赋值，因此必须在某个位置用nameToggle()调用它，然后才能单击。

如果您不想，您必须将外部的分配作为一个函数：

document.getElementById("nameInput").onclick = showAlert;

编辑根据您的评论：只有DOM元素是可点击的。label只是元素的一个属性，不能单击属性。在输入之前将标签作为html中的真实元素，如下所示：

<label for="nameInput" onclick="showAlert()">Name</label>

for-属性表示此<label>属于id=nameInput的输入。您可以在标签内分配onclick，如上所示，也可以使用：

 document.querySelector("label[for='nameInput']").onclick = showAlert;
相关文章：