javascript - 验证后在页面上显示消息

Question

我的 html 文件中有以下条目。基本上这个条目的用途是当用户将鼠标悬停在输入字段上时在页面上显示一条消息。现在我想显示相同的消息，所以我决定在 javascript 中进行相同的验证。那么我无法显示消息框，请帮忙。

.field:hover .hint {  
    position: absolute;
    display: block;  
    margin: -30px 0 0 455px;
    color: #000000;
    padding: 7px 10px;
    background: #FFFC17;

    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px; 
    }

<TR> 
    <TD><label for="name"><bean:message key="addEmail"/></label><div style="float:left">
  <div class="field"><html:text property="emailid" maxlength="150" size="40" style="color=#7D2252" styleClass="input"></html:text>
  <p class="hint"><bean:message key="addEmailMsg"/></p></div>
  </div>
  </TD>
    </TR>

我们可以看到div标签的入口。和提示类。请帮我基本上我是 java 程序员，并没有实现太多的 javascript 和 css。谢谢

Answer 1

代替css，你可以使js函数并将其放在鼠标悬停事件中

function show_hint(){
var hint = document.getElementById('hint');
hint.style.display = "block";
}

并像这样提示

<p id="hint"><bean:message key="addEmailMsg"/></p>

并制作事件

<div class="field" onmouseover="show_hint();"></div>

或者只是使用 jquery 隐藏“提示”

html

<p id="hint" style="display:none;"><bean:message key="addEmailMsg"/></p>

js

 jQuery(document).ready(function($) {
        $(".field").hover(
          function () {
            $('.hint').show();

        }); });