鼠標懸停對子Div的影響---需要解決方案

只要使用該代碼即可理解問題。

這裏是我的代碼：

<div onmouseover="mOver(this)" onmouseout="mOut(this)" style="background-color:#D94A38;width:120px;height:20px;padding:40px;">Mouse Over Me</div> 

<script> 
function mOut(obj) 
{ 
obj.innerHTML="Thank You" 
} 

function mOver(obj) 
{ 
obj.innerHTML='<table style=" border:solid 1px #ff0000;"><tr><td><label>Username</label><input type="text" name="username" id="username" maxlength="64" value="SwapnilC" autocomplete="off"><br/><label for="pass">Password</label><input type="password" name="pass" id="pass" value="Password"></div><div style=" float:right;width:90px;background-color:#933;" onClick="ClickLogin();">Login</div><div style="float:right; margin-right:10px; width:20px; padding-top:4px;"> <img id="PP_loading" title="Processing Request" style="display:none;" src="images/ajaxProcess.gif" /> </td></tr></table>' 
} 
</script> 

</body> 
</html>

來源

2013-05-08 Neal

不要追加鼠標懸停的HTML標記，而使用類隱藏/過/出

的Javascript顯示鼠標表：

function mOut(obj) 
{ 
    obj.style.display="none"; 
} 

function mOver(obj) 
{ 
    obj.style.display="block" 
}

來源

2013-05-08 12:45:15 Tralli

你最好用「Tahnk你」和你的表格直接在div中。然後隱藏表格（「display：none」）並在需要時切換可見性 span display：none | inline; table display：none | block;

而所有這些都可以使用CSS來完成。

來源

2013-05-08 12:46:26 Serge

可以使用this

的jQuery：.removeAttr（的attributeName）功能。

<!DOCTYPE html> 
<html> 
<head> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
</head> 
<body> 
    <button>Change title</button> 
<input type="text" title="hello there" /> 
<div id="log"></div> 

<script> 
(function() { 
    var inputTitle = $("input").attr("title"); 
    $("button").click(function() { 
    var input = $(this).next(); 

    if (input.attr("title") == inputTitle) { 
     input.removeAttr("title") 
    } else { 
     input.attr("title", inputTitle); 
    } 

    $("#log").html("input title is now " + input.attr("title")); 
    }); 
})(); 
</script> 

</body> 
</html>

來源

2013-05-08 12:48:11 Tom

鼠標懸停對子Div的影響---需要解決方案

回答

相關問題