4

マウスオーバー時のaspボタンの設定を変更するためにjavascriptを使用しています。IEで動作しています。しかし、Firefoxでは機能しません。ほとんどすべてのブラウザーをサポートする他の JavaScript コードはありますか? 私のコードは次のとおりです

<script type="text/javascript">
        var previousColor;
        function Changecolor() {
            previousColor = window.event.srcElement.style.backgroundColor;
            window.event.srcElement.style.backgroundColor = "Blue";
            window.event.srcElement.style.cursor = "hand";
        }
        function RestoreColor() {
            window.event.srcElement.style.backgroundColor = previousColor;
        }
</script>


<asp:Button ID="btnSearch" runat="server" BackColor="#800000" Font-Bold="True" Font-Names="Arial" onmouseover="Changecolor();" onmouseout="RestoreColor();" ForeColor="White" Height="28px" OnClick="btnSearch_Click2" Text="Search Jobz" Width="117px" />
4

4 に答える 4

8

eventsに関する Mozilla Developer Center のドキュメントを参照してください。Internet Explorer では、イベントが発生すると、グローバル イベント オブジェクトが作成されます。標準準拠のブラウザーでは、イベント オブジェクトは、起動イベントに割り当てられた関数の最初の引数として渡されます。イベントが HTML で定義されている場合、イベント オブジェクトは変数名で作成され、event呼び出している関数に渡すことができます。

また、このevent.srcElementプロパティは IE のみであり、他のほとんどのブラウザーがevent.target代わりに使用することに注意してください。

これを考慮すると、関数は次のようになります。

<script>
        var previousColor; 
        function Changecolor(evt) {
            var srcEl = evt.srcElement || evt.target;
            previousColor = srcEl.style.backgroundColor; 
            srcEl.style.backgroundColor = "Blue"; 
            srcEl.style.cursor = "pointer"; 
        } 
        function RestoreColor(evt) {
            var srcEl = evt.srcElement || evt.target;
            srcEl.style.backgroundColor = previousColor; 
        } 
</script> 


<asp:Button ID="btnSearch" runat="server" BackColor="#800000" Font-Bold="True" Font-Names="Arial" onmouseover="Changecolor(event);" onmouseout="RestoreColor(event);" ForeColor="White" Height="28px" OnClick="btnSearch_Click2" Text="Search Jobz" Width="117px" />
于 2010-01-22T09:29:45.467 に答える
1

:hoverJSの代わりにCSS(その疑似クラスを含む)を使用してみませんか?

ただし、何らかの理由でJSを使用する必要がある場合は、要素への参照を関数パラメーターとして渡すだけです。

function Cangecolor(ref){
  prevousColor = ref.style....;

...

onmouseover="changecolor(this)"

現在、IEは異なるイベントモデルを使用しているため、コードは機能しません(優れたブラウザーは、W3Cイベントモデルを使用しますが、IEは独自のイベントモデルを使用します)。W3C / IEイベントモデルについては、次のURLで読むことができます:IEとW3Cイベントモデルをイコライズする方法]

于 2010-01-22T09:35:31.933 に答える
1

イベント オブジェクトを気にする必要はありません。また、カーソルの CSS プロパティの正しい値は、IE 5 または 5.5 をサポートする必要がない限り、IE 固有の「hand」ではなく「pointer」です。

<script type="text/javascript">
        var previousColor;

        function changeColor(el) {
            var s = el.style;
            previousColor = s.backgroundColor;
            s.backgroundColor = "Blue";
            s.cursor = "pointer";
        }
        function restoreColor(el) {
            el.style.backgroundColor = previousColor;
        }
</script>


<asp:Button ID="btnSearch" runat="server" BackColor="#800000"
    Font-Bold="True" Font-Names="Arial"
    onmouseover="changeColor(this);" onmouseout="restoreColor(this);"
    ForeColor="White" Height="28px" OnClick="btnSearch_Click2"
    Text="Search Jobz" Width="117px" />
于 2010-01-22T09:38:53.037 に答える
1

以下のコードで同じ(firefoxのwindow.event)問題に直面していました。

<html>
<body onkeyup="fClosePop();">
</body>
<script language="javascript">
  function fClosePop(){
        var e= (window.event)?event.keyCode:evt.which;  
        if( e.keyCode ==27)
        {
            try
            {
                alert(1);
            }
            catch(e)
            {

            }
        }      
    } 
</script>
</html>

次に、コードを微調整しようとしたところ、以下の解決策が見つかりました。関数からイベントを渡しました。

<html>
<body onkeyup="fClosePop(even);">
</body>
<script language="javascript">
  function fClosePop(e){
           if( e.keyCode ==27)
           {
                      try
                      {
                       alert(1)
                       }
                      catch(e)
                      {

                      }
            }      
    } 
</script>
</html>

これがお役に立てば幸いです。

于 2012-03-02T07:58:19.477 に答える