2011-09-29 310 views
0

标签内更改文字我已经定义的标签,其中在鼠标悬停我改变鼠标悬停

<a class="bid-addwatchlist add-logout" href="https://stackoverflow.com/users/login" onmouseover="changeText(this)" onmouseout="sameText(this)"><span style="font-size: 32px; line-height: 18px;">+</span><span style="font-size: 14px; float: left;">Add to watchlists</span></a> 

<script> 
    function changeText(theTag){ 
     theTag.innerHTML = '<span style="font-size: 1.7em; text-align:center; line-height:50px;">Login</span>'; 
    } 

    function sameText(theText){ 
     theText.innerHTML = '<span style="font-size: 32px; line-height: 18px;">+</span><span style="font-size: 14px; float: left;">Add to watchlists</span>'; 
    } 
</script> 

我已经给下面的CSS这样做的一个标签中的文本标签,使它看起来像一箱

.bid-addwatchlist{ 
    background-color : #32679B; 
    border-radius : 5px 5px 5px 5px; 
    color : #FFFFFF; 
    cursor : pointer; 
    float : left; 
    height : 56px; 
    line-height : 14px; 
    padding-top : 4px; 
    text-decoration : none; 
    width : 76px; 
    margin-left : 11px; 
} 

它工作正常,但我面临的问题是,当我做鼠标悬停文本更改登录,如果我点击登录文字什么也没有发生,而如果我在其他侧面区域单击它是加工。我不明白为什么会发生这种情况,我现在需要做的是如果我点击登录文本,它的工作原理。请提出我需要做的或这是因为登录文本不在a标签内。我所需要做的是我想更改标签onmouseover中的文本,因此它应该工作。

我也试过,在跨度定义click事件的文字,但没有工作

function changeText(theTag){ 
     theTag.innerHTML = '<span style="font-size: 1.7em; text-align:center; line-height:50px;" onclick=\'window.location="https://stackoverflow.com/users/login"\'>Login</span>'; 
    } 

注:文本仅仅是一个正常的链接

+0

对于'onclick'事件,您正在使用的代码是什么? –

+0

我还没有定义任何点击事件,因为它只是一个普通的标签,它会自动打开 – user850234

+0

你应该把它放到一个JSFiddle中,而不是只显示我们一些代码。这会让你的问题更容易回答,因为我们可以使用你的代码测试不同的方法 –

回答

0

我觉得你的问题是因为它不在DOM解析的时间内,因此你为onMouseOver放置的文本未绑定到链接元素。因此,我会将链接添加到登录文本。

function changeText(theTag){ 
    theTag.innerHTML = '<span style="font-size: 1.7em; text-align:center; line-height:50px;"><a href="https://stackoverflow.com/users/login">Login</a></span>'; 
} 
+0

你有我的问题,但这不工作,现在试了 – user850234

+0

你确定吗?它适用于我在LOGIN文本周围额外使用,我可以单击登录按钮并转到/ users/login,只需CSS将需要一些工作,因为它具有默认的丑陋蓝色悬停和下划线。 –

+0

它没有工作在我的一个附加一个标签 – user850234