1

これは私が持っているものです

私の.masterページには次のものがあります

<script type="text/javascript">
$(document).ready(function() {
    $(this).hover(function() {
        $(this).addClass("ui-state-hover");
    },
        function() {
            $(this).removeClass("ui-state-hover");
        }
    ).mousedown(function() {
        $(this).addClass("ui-state-active");
    })
    .mouseup(function() {
        $(this).removeClass("ui-state-active");
    });
});

私のasp.netボタンは次のように宣言されています

<asp:button runat="server" id="cmdSubmitShipmentRequest" cssclass="ui-button ui-state-default ui-corner-all" text="Submit" />

期待される動作は、マウス ポインターが任意のボタンに出入りするたびに、上記で宣言された css クラスが追加および削除されることです。現在、デフォルトの css プロパティは適切に適用されますが、ボタンをホバーすると、次のエラー "Object Expected" Line 11 (IE8 の他のブラウザーでは何も表示されません) が表示されます。これは、"<script type="text/javascript">"開始位置です。

私が間違っているかもしれないことについての手がかりはありますか？

答えて編集

私は2つの間違ったことをしていました

  1. $(this).hoverを使用していましたが、最初は$('.ui-button'). hoverである必要がありましたが、 $(".ui-button " ).hover と入力しました 二重引用符に注意してください!

  2. 私の .master ページでは、次のように asp.net JavaScript マネージャーを使用して JavaScript を宣言しています。

問題は、JavaScript コード ブロックの下にスクリプト宣言があることでした。

最後に、これは JavaScript とコード ブロックがどのように見えるかであり、すべてが期待どおりに機能します。

<asp:scriptmanager id="scriptManager" runat="server">
    <scripts>
        <asp:scriptreference path="~/javascript/jquery-1.3.2.min.js" />
        <asp:scriptreference path="~/javascript/jquery-ui-1.7.2.custom.min.js" />
        <asp:scriptreference path="~/Javascript/thickbox.js" />
    </scripts>
</asp:scriptmanager>

 <script type="text/javascript">
     $(document).ready(function() {
         $('.ui-button').hover(function() {
             $(this).addClass("ui-state-hover");
         },
            function() {
                $(this).removeClass("ui-state-hover");
            }
        ).mousedown(function() {
            $(this).addClass("ui-state-active");
        })
        .mouseup(function() {
            $(this).removeClass("ui-state-active");
        });
     });
</script>
4

3 に答える 3

3

コードをこれに変更してみてください....

$(document).ready(function() {
    //SELECT THE .ui-button CLASS INSTEAD OF this
    $('.ui-button').hover(function() {
        $(this).addClass("ui-state-hover");
    },
                function() {
                    $(this).removeClass("ui-state-hover");
                }
        ).mousedown(function() {
            $(this).addClass("ui-state-active");
        })
        .mouseup(function() {
            $(this).removeClass("ui-state-active");
        });
});

「これ」には、このコード行を使用するときにターゲットとしていたコンテキストがあるとは思いません...

$(this).hover(function() {

上記の行を次の行に置き換えてみてください...

$('.ui-button').hover(function() {
于 2009-07-17T16:42:27.830 に答える
1

現在のコード スニペットでは、$(this) は $(document) を参照しています。これを試して：

$(document).ready(function() {  
    $('.ui-button').hover(function() {  
        $(this).addClass("ui-state-hover");  
    }, <rest of code omitted>
}

$(this) は $('.ui-button') を参照していますが、これはあなたが望むものです。

于 2009-07-17T16:49:07.550 に答える
1

これはあなたが望むものをもっと与えるでしょうか？

また、この上のどこかに jquery ライブラリが含まれていることを確認してください。

$(document).ready(function() {
    $('.ui-button').hover(function() {
        $(this).addClass("ui-state-hover");
    },
                function() {
                    $(this).removeClass("ui-state-hover");
                }
        ).mousedown(function() {
            $(this).addClass("ui-state-active");
        })
        .mouseup(function() {
            $(this).removeClass("ui-state-active");
        });
});
于 2009-07-17T16:42:00.343 に答える