0

クリックされたときに他のリンクのリンクを変更しようとしています。たとえば、ユーザーが AZ をクリックすると、0 ～ 9 の色が変わります。

<a href="" id="list_users_title" onclick="document.getElementById('oneline a').style.color = '#414042'; document.getElementById('list_users_title a').style.color = '#B91200';">A-Z</a>
<a href="" id="oneline" onclick="document.getElementById('oneline a').style.color = '#B91200'; document.getElementById('list_users_title a').style.color = '#414042';">0-9</a>

色でそれを行うことができますが、これはまだ使用したい a:hover をオーバーライドします。

どんな助けでもいただければ幸いです

4

2 に答える 2

1

あなたの問題は、javascript の助けを借りて、aタグにインライン css を追加していることです。styleインライン CSS は、タグ内の CSS よりも優先されます。

ここで解決策-

<div id='style'></div>

<a href="" id="list_users_title" onclick="document.getElementById('style').innerHTML = '<style>ADD CSS HERE</style>';">A-Z</a>

これはインラインCSSを追加しません

于 2012-06-12T21:11:29.853 に答える
0

使用するときは、必要な要素のIDgetElementByIdを渡す必要があります。代わりにこのようなことをしてください。document.getElementById('oneline')document.getElementById('oneline a')

編集

スタイルをオーバーライドしたくない場合は、スタイルを直接適用する代わりに、onclick イベントを使用して要素にクラス (たとえば、"clicked-by-oneline") を追加します。次に、スタイルシートを使用して、次のようなルールを定義します。 

#oneline.clicked-by-oneline { color: #414042; }
#list_users_title.clicked-by-oneline { color: #B91200; }

カスケードを使用して、これらのスタイル オーバーライドがどのように相互作用するかを正確に制御します。

于 2012-06-12T21:02:35.390 に答える