DOM을 볼 때 jQuery 함수를 실행하십시오.

Question

유효성 검사 요약에 결과를 표시하는 사용자 정의 유효성 검사가있는 페이지가 있습니다. 유효성 검사 요약 길이만큼 페이지를 스크롤하지 않고이 유효성 검사 요약을 페이지 하단으로 재배치하고 싶습니다. 이 매우 잘 수행하는 jQuery 함수를 가지고 있지만 유효성 검사 요약이 표시되고 트리거 할 이벤트를 잘 모르겠다면이 jQuery를 실행해야합니다. 내 사용자 지정 유효성 검사 방법에

$(document).ready(function(){ 
$("#<%= vsmSummary.ClientID %>").change(function(){ 
    var newTop = $(window).height() - $("#vsmSummary").height(); 
    var newLeft = ($(window).width() - $("#vsmSummary").width())/2; 

     $("#vsmSummary").css(
      { 
       'position': 'absolute', 
       'left': newLeft, 
       'top': newTop 
      } 
     ); 
    }); 
}); 

나는

이 작동

Dim scriptText As String = "$(document).ready(function(){ " + _ 
          "$(""#<%= vsmSummary.ClientID %>"").ready(function(){" + _ 
           "var newTop = $(window).height() - $(""#vsmSummary"").height();" + _ 
           "var newLeft = ($(window).width() - $(""#vsmSummary"").width())/2;" + _ 
            "$(""#vsmSummary"").css(" + _ 
            "{" + _ 
              "'position': 'absolute'," + _ 
              "'left': newLeft," + _ 
              "'top': newTop" + _ 
            "}" + _ 
            ");" + _ 
           "});" + _ 
          "});" 


RadScriptManager.RegisterClientScriptBlock(Me.upSCPPage, Me.upSCPPage.GetType(), "DynamicVSM", scriptText, True) 

...이 문자열을 구축하고 RadScriptManager에 등록! 학습 경험을 주셔서 감사합니다. 나는이 코드를 내 코드에서 호출 할 수 있다는 것을 알지 못했습니다 !! 나는 앞으로 더 많이 이것을 할 것입니다!

Answer 1

AFAIK jQuery가 innerHtml 변경 사항을 감지하는 이벤트를 제공하지 않을 때 유효성 검사 요약을 포함하는 요소의 위치를 ​​변경하려는 것이 맞으면 이해합니다.

제안 사항을 함수로 이동하여 요청시 유효성 검사 코드에서 호출하는 것이 좋습니다. 이 같은

jQuery.fn.reposition = function() { 
var newTop = $(window).height() - $(this).height(); 
var newLeft = ($(window).width() - $(this).width())/2; 

      $(this).css(
       { 
        'position': 'absolute', 
        'left': newLeft, 
        'top': newTop 
       } 
      ); 
} 

후 전화 :

$("#vsmSummary").html('Your Validation Message Here').reposition(); 

참고 : 당신은 innerHTML.length로 확인하실 수 있습니다 당신이 청소기는 심지어 jQuery를 함수로 그것을 만들 수 있습니다 원하는 경우

//in your validation code 
$("#vsmSummary").html('Your Validation Message Here'); 
Reposition(); 

//in a separate function 
function Reposition() 
{ 
var newTop = $(window).height() - $("#vsmSummary").height(); 
    var newLeft = ($(window).width() - $("#vsmSummary").width())/2; 

     $("#vsmSummary").css(
      { 
       'position': 'absolute', 
       'left': newLeft, 
       'top': newTop 
      } 
     ); 
} 

그리고 setInterval(),하지만 그 잔인한 솔루션입니다.

Answer 2

이 시도 :

#vsmSummary { 
    position: fixed; 
    bottom: 0; 
    left: 0; 
    height: 25px; 
} 

이 스타일은 오히려에만 유효성 검사 요약 쇼보다, 모든 시간을 적용했습니다. div를 페이지 하단에 고정해야합니다.