jQuery document.readyモーダルポップアップを再度開くと起動しますか？

Question

jQueryを使用して、ユーザーが入力した文字数と残りの数のテキストボックスの上にカウンタを表示しています。これは、テキストボックスの上のspanの.text()を更新することによって行います。

したがって、$(document).readyでは、最初にテキストボックスの最大長にスパンを設定してから、onkeyupが更新されます。

しかし、テキストボックスがajaxコントロールライブラリのASP.NET ModalPopupの中にある場合、ModalPopupを閉じてから再び開くと、$(document).readyは再発するように見えます

（私の例では、AutoPostBack = "true"のModalPopup内にDropDownListがあり、ポストバック後には.Show()の後に残りの文字数は更新されませんメソッドがポップアップエクステンダーで呼び出されて表示されるようにします）

私は同様のことを見つけたとき、私は.liveイベントはjQueryで、これは私がkeyupハンドラのために行ったものです。 spanの初期設定の問題を解決するための類似の方法はありますか？

ASP.NETマークアップ：

<asp:Content ID="Content2" ContentPlaceHolderID="cMain" Runat="Server"> 
    <p> 
     Enter some text (<span id="countRemain"></span> characters remaining) <br /> 
     <asp:TextBox runat="server" id="txtCounterTest" MaxLength="100" CssClass="input mediumField CountMe" /> 
    </p> 
</asp:Content> 

と関連するjQueryの：

$(document).ready(function() { 
    $(".CountMe").each(function() { 
     var txtBoxContent = ($(this).val()); 
     var txtBoxMaxLength = ($(this).attr("maxlength")); 

     var length = (txtBoxMaxLength - txtBoxContent.length) + '/' + txtBoxMaxLength; 

     //alert(length); 

     $(this).parent().find("#countRemain").text(length); 
    }); 

    $(".CountMe").live("keyup", function (event) { 
     var txtBoxContent = ($(this).val()); 
     var txtBoxMaxLength = ($(this).attr("maxlength")); 

     var length = (txtBoxMaxLength - txtBoxContent.length) + '/' + txtBoxMaxLength; 

     //alert(length); 

     $(this).parent().find("#countRemain").text(length); 
    }); 
}); 

Answer 1

私はアヤックスが実行された後に "準備完了" イベントが再び発生しません怖いです。

/私はので、私はそれに非常に精通していないよ、ユーザーAJAXコントロールツールキット決してきたんModalPopupExtender

にイベントを「隠し」「示す」を追加。ポップアップの表示/非表示時にイベントハンドラをアタッチする方法を説明しているadd_shown & add_hiding ModalPopupExtender Events articleが見つかりました。

これは私が達成したいと思います。モーダルが表示されたら、「ユーザーが入力した文字の数と残した数」を再計算します。

Sys.Application.add_load(pageInit); 

function pageInit() 
{ 
    var modalPopup = $find('ModalPopupExtender1'); 
    modalPopup.add_shown(onModalShown); 
} 

function onModalShown(sender, args) 
{ 
    // this will be executed when the modal is shown. 
    // re-calculate here the character thing 
} 

私は正直であることをテストしていませんが、それはあなたにリードを与えるべきでしょう。

さらに読書：

• ASP.net Ajax Client Life-Cycle Events
• PageRequestManager class

イベント委任

に関してjqueryを使用して "keyup"イベントを委任する場合は、の代わりに.delegate()（jQuery 1.4.3+）または.on()（jQuery 1.7+）を使用してください。後者は現在廃止されており、今後のバージョンではjqueryライブラリから削除される可能性があります。

委任mechnismは完全に異なる、より効率的で、構文も少し異なります。すなわち

$("#someParentContainer").delegate('.CountMe', 'keyup', function(e) { 

}); 

$("#someParentContainer").on('keyup', '.CountMe', function(e) { 

}); 

、あなたがイベントを委譲しますクラス「.CountMe」を持つ要素からトリガー「からkeyup」親要素（例：#Contentパネルなど）に移動します。

Answer 2

Didier Ghysが受け入れた回答で引用された記事は、正しい道に沿って私を導いてくれました。しかし、私は$find()が仕事と実際にModalPopupExtenderを見つけるために得ることができませんでした試みたものは何でも、それだけで'null' is null or not an object

を返すまま、私がやったように、すべてのときを含め、すべての時間を発射した私のASPXページに次の<script>を追加しましたModalPopupを示した： -

onShow()

<script language="javascript" type="text/javascript"> 
    function pageLoad() { 
     onShow(); 
    } 
</script> 

は、文字の適切な数にスパンを設定し、私のjQueryのファイルに定義されている方法です。

少しハッキリしていますが、そのトリックは終わっています。