링크를 두 가지 동작으로 만드시겠습니까?

Question

링크를 두 가지 동작으로 만들려면 어떻게해야합니까? 여기에 내가해야 할 일이있다 :

링크를 클릭 할 때 jQuery ScrollTo 플러그인을 사용하여 앵커로 스크롤하고있다. 하지만 스크롤 할 div에있는 iframe에 새 콘텐츠를로드 할 때도 동일한 클릭이 필요합니다.

<a href="#scrollhere">link</a 

. 

. 

. 


<div id="scrollhere"> 

    <iframe that will load different page based on the link that was clicked> 

</div> 

일반적으로,이 두 가지 조치 중 각각의 작업을 할 수있는 링크의 "HREF"부분을 사용하지만 링크가이 명하는 HREF를 가질 수 없습니다. 나는 어떻게 이것을 성취 할 것인가?

더 나은 솔루션이 있으면 iframe을 사용할 필요가 없습니다. 기본적으로 동일한 앵커 div로 스크롤하는 데 필요한 여러 링크가 필요합니다. 클릭 한 링크에 따라 해당 div에로드 된 콘텐츠가 달라집니다.

감사합니다.

Answer 1

iframe의 src를 업데이트하는 함수를 작성하고이 함수를 앵커에 대한 클릭 이벤트 핸들러로 추가해야합니다. 각 앵커의 함수에 매개 변수로 특정 링크를 보냈습니다. 자세한 내용을 보려면 아래 샘플을보십시오.

<a href="#scrollhere" onclick="loadOnFrame ('/hello.html')">link 01</a> 

    <a href="#scrollhere" onclick="loadOnFrame ('/world.html')">link 02</a> 


    <div id="scrollhere"> 
     <iframe src=""></iframe> 
    </div> 

    <script> 
     var loadOnFrame = function(url) { 
      $("#scrollhere iframe").attr("src", url); 
     };  
    </script>