在 JavaScript onClick 中：为什么中风出现然后消失？答案

【问题标题】：In JavaScript onClick: why stroke appears then disappears?在 JavaScript onClick 中：为什么中风出现然后消失？
【发布时间】：2014-10-02 07:17:29
【问题描述】：

我正在使用此代码，但是当我点击时，笔划出现并直接消失：

var tag = document.getElementById("tag");
function result()
{
  $(tag.value).css('border','1px solid red');
}

<button id="showBtn" onclick='result()'>Show</button>

但是当我将事件类型更改为 "onmouseover" 时，笔划会停留并且不会消失。

【问题讨论】：

【解决方案1】：

正如 jfriend00 所说，您调用 document.getElementById 为时过早。试试：

function result() {
    $(tag).css("border", "solid 1px red");
}
var tag;
$(function() {
   tag = document.getElementById("tag"); 
});

在 Thilo 评论后编辑：

var tag;
$(function() {
   tag = document.getElementById("tag"); 
});

function result() {
    $("#" + tag.value).css("border", "solid 1px red");
}

假设您的 HTML 类似于：

<input id="tag" value="rect"></input>
<button id="showBtn" onclick='result();'>Show</button>
<div id="rect">This is a Div</div>

【讨论】：