jquery를 사용하여 div ID의 위치로 스크롤 하시겠습니까?

URL에서 ID를 캡처 한 후에 해당 div를 기반으로 탐색하려고합니다.jquery를 사용하여 div ID의 위치로 스크롤 하시겠습니까?

URL은 사용자가이 페이지 여기

http://localhost:6447/products/all-products#productId2

를 탐색한다 처음으로 아래와 같은입니다 # productId2 페이지에서 DIV 아이디는 내가 페이지로드 스크롤해야하는 것입니다 내가

페이징으로 목록보기에 제품을 표시합니다.

<ItemTemplate> 
       <tr> 
        <td> 
         <div id='#productId<%#Eval("PId")%>'> 
          <a class="ProdcutText"> 
           <%#Eval("PName")%></a> 
         </div> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         <div class="PriceText"> 
          -<a class="PPrice"><%#Eval("Price")%></a></div> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         <div class="PDesc"> 
          <asp:Label ID="lblDesc" runat="server" Text='<%#Eval("PrdocutDescription")%>'> </asp:Label> 
         </div> 
        </td> 
       </tr> 
      </ItemTemplate>

페이지 아래에 시도했지만 작동하지 않는 것 같습니다.

<asp:Content ID="HeadContent" ContentPlaceHolderID="MasterHeadContentHolder" runat="server"> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('html,body').animate({ 
      scrollTop: $("#productId6").offset().top 
     }, 2000); 
    }); 
</script>

잘못 무엇입니까? 및 페이징 후 url 변경 및 내가 정의되지 않은 및 null 오류 오류 가져옵니다.

var $target = $(location.hash); 
    var pos = Math.max(0, $target.offset().top); 
    var $view = browser.indexOf('WebKit') < 0 ? $('html') : $(document.body); 
    $view.animate({'scrollTop': pos});

첫 번째 줄은 # productId2처럼 URL에서 제품 ID를 가져옵니다

<div id="productId2"> 
    Proiduct details 
</div>

출처

2013-11-28 Abhishek Ranjan

이것은 서버 문제이며, ASP는 페이징을위한 쿼리 문자열을 추가하지만 위치 해시를 추가하지 않으므로 사라집니다. – adeneo

@adeneo : 예 알아요. null 일 때이 상황을 처리하는 방법이 사라졌습니다. –

명확하게 HTML은를 생성해야한다 그런 다음 해당 id를 가진 요소를 찾습니다. #은 ID에 대한 jQuery 선택 자입니다. 두 번째 줄은 페이지 아래로 해당 요소의 위치 (스크롤 량)를 계산합니다. 세 번째 줄은 스크롤 할 항목을 결정하며 HTML (Chrome & Safari의 경우) 또는 BODY를 결정합니다. 마지막 줄이 부드럽게 스크롤됩니다.

출처

2013-11-28 18:56:20

감사합니다. Id에 대해서도 #을 작성했습니다. URL에서 값을 가져 와서 값을 jquery로 스크롤하여 전달하는 방법을 안내 할 수 있습니까? –

오류가 발생합니다. 'JavaScript 런타임 오류 : 정의되지 않은 null 참조의'top '속성을 가져올 수 없습니다. 다음 페이지에서 #productId를 사용할 수 없으므로 페이징을 사용하여 탐색 할 때 null 참조입니다. 어떻게 처리할까요? –

이 자바 스크립트 코드를 사용해보십시오 : 아래와 같이

http://localhost:6447/products/all-products?list=1

출처

2013-11-28 18:58:14 Costel

감사합니다. 하지만 몇 번이나 'JavaScript 런타임 오류 : 정의되지 않은 참조 또는 null 참조'속성 '상위'를 가져올 수 없습니다. 뿐만 아니라 위치로 점프하고 애니메이션을 수행하지 않습니다. –

오류를 방지하려면 마지막 줄 다음에 if ($ target.length) {첫 번째 줄 다음에}를 추가하십시오. – Costel

당신 이름은 다음 인 test.html 번호가 1 개 인 test.html 번호 그것이 div에 스크롤합니다 DIV2 div에 스크롤합니다 div1 URL을 입력 test.html를로 가정 파일 때 코드 아래 보시기 바랍니다 2

<html> 
<body> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 


<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<div id="div1">div</div> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 

<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 

<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<div id="div2">Div start</div> 
</body> 
</html>

출처

2013-11-28 19:21:39

코드는 어디입니까? –

그 html 코드 만. _js_ 또는 다른 것들이 필요 없습니다. –

죄송합니다. 그러나 나는 이해하지 못했다. 해결 방법 'JavaScript 런타임 오류 : 정의되지 않은 참조 또는 null 참조의'상위 '속성을 가져올 수 없습니다? –

jquery를 사용하여 div ID의 위치로 스크롤 하시겠습니까?

답변

관련 문제