0

私はこのjQueryファイルを持っています

   jQuery(document).ready(function() {        
     var orderId= <%= OrderLi.ClientID %>;

    jQuery("#ApprovalTab").css("display", "block");
    jQuery("#ApprovalLi").css("background-color", "#5EA8DE");
    jQuery("#ApprovalLi a").css("color", "#FFF");
    jQuery("#OrdersTab").css("display", "none");
    jQuery("#ApprovalLi a").css("border-bottom", "3px #5EA8DE solid");

    jQuery("#ApprovalLi").click(function() {
        jQuery("#ApprovalTab").css("display", "block");
        jQuery("#ApprovalLi").css("background-color", "#5EA8DE");
        jQuery("#ApprovalLi a ").css("color", "#FFF");
        jQuery("#orderId a").css("color", "black");
        jQuery("#Arrow").css("margin-left", "15px");
        jQuery("#ApprovalLi a").css("border-bottom", "3px #5EA8DE solid");
        jQuery("#orderId a").css("border-bottom", "3px #D8D9DC solid");
        jQuery("#orderId").css("background-color", "#F0F1F4");
        jQuery("#OrdersTab").css("display", "none");

    });

    jQuery("orderId").click(function() {
        jQuery("#ApprovalTab").css("display", "none");
        jQuery("#OrdersTab").css("display", "block");
        jQuery("#Arrow").css("margin-left", "112px");
        jQuery("#orderId").css("background-color", "#5EA8DE");
        jQuery("#orderId a").css("border-bottom", "3px #5EA8DE solid");
        jQuery("#ApprovalLi a").css("border-bottom", "3px #D8D9DC solid");
        jQuery("#ApprovalLi").css("background-color", "#F0F1F4");
        jQuery("#orderId a").css("color", "#FFF");
        jQuery("#ApprovalLi a").css("color", "black");


    });

    jQuery("#orderId").hover(function() {
        jQuery("#orderId a").css("border-bottom", "3px #5EA8DE solid");
    });

    jQuery("#ApprovalLi").hover(function() {
        jQuery("#ApprovalLi a").css("border-bottom", "3px #5EA8DE solid");
    });
  });

これに適用されます:

<ul class="etabs">
<li id="ApprovalLi"><a href="#stopAtTop">Approval </a></li>
<li id="OrderLi" runat="server"  ><a href="#stopAtTop">Orders</a></li>
</ul>

runat = "server"コードを使用しない場合は問題なく機能しますが、使用するとコードがレンダリングされません。インターネットで何かを検索しましたが、これについて見つけたのは「IDが変更されている」ということだけでした。私はすでにそれを知っていました、そしてあなたは私がサーバーIDを使用していることを上のjQueryで見ることができます。

ところで:私は上記のコードを最適化できることを知っていますが、最初にそれを機能させたいと思っています。

他に何が問題になる可能性がありますか?

ありがとうございました。

4

1 に答える 1

2

変数orderIdClientID次を使用して設定します。

var orderId= <%= OrderLi.ClientID %>;

ただし、文字列リテラルにするには、の値をClientID引用符で囲む必要があります(Yuriyのおかげで、最初はこれを見逃していました)。そうしないと、これ自体が問題を引き起こします。

var orderId= '<%= OrderLi.ClientID %>';

しかし、それをまったく利用していないようで、代わりorderIdに、jQueryセレクターでハードコードされた文字列リテラルを使用する他の2つのメソッドを使用して何かにアクセスしようとします。

 jQuery("orderId")

 jQuery("#orderId")

ここで、1つ目は要素(またはのすべての要素)orderIdを検索し、2つ目は識別子が。の要素を検索し"orderId"ます。したがって、コードがなくても機能し、を 追加runat="server"すると壊れるように見えるのは完全に偶然です。 runat="server"

必要なのは、実際に変数を使用することです。

jQuery(orderId)

さらに正確に言うと、セレクターでIDを使用している場合、次のようになります。

jQuery("#" + orderId)

使用量ごとにではなく、変数値の前にハッシュを付ける方が便利な場合があります(使用量の合計によって異なります)。

于 2012-10-24T10:07:42.300 に答える