[JQUERY] JQuery와 가진은 iframe에 클릭 이벤트를 추가하는 방법

JQuery와 가진은 iframe에 클릭 이벤트를 추가하는 방법

해결법

1. ---

   1.이 iframe을위한 '온 클릭'이벤트는 더 없다, 그러나 당신은 iframe이있는 문서의 클릭 이벤트를 잡으려고 시도 할 수 있습니다 :

   이 iframe을위한 '온 클릭'이벤트는 더 없다, 그러나 당신은 iframe이있는 문서의 클릭 이벤트를 잡으려고 시도 할 수 있습니다 :

   document.getElementById("iframe_id").contentWindow.document.body.onclick = 
   function() {
     alert("iframe clicked");
   }
   

   편집하다 이 귀하의 사이트 간 문제가 해결되지 않지만, 참고로 jQuery를이 iframe이 잘 작동하도록 업데이트되었습니다 :

   $('#iframe_id').on('click', function(event) { });
   

   업데이트 2,015분의 1 더 이상 사용할 수로 iframe이 설명에 대한 링크가 제거되지 않았습니다.

   노트 iframe이 호스트 페이지가 아닌 다른 도메인에있는 경우, 위의 코드는 작동하지 않습니다. 당신은 여전히 ​​의견에 언급 해킹을 사용하려고 할 수 있습니다.

2. ---

   2.나는 JQuery와 이벤트 및 사용자 정의 이벤트를 수행하는 방법에 대해 생각하기 시작, 그래서 나는 더 독립이었다 더 나은 해답을 찾기 위해 노력했다. 트리거는 iframe을의 내용이 클릭 된 것을 주어진 이벤트 (JQuery와)에서 클릭 그냥 어떤 경우이기 때문에, 나는 모든 내가해야 할 일을했을 것이라고 생각했다. 따라서,이 내 솔루션이었다

   나는 JQuery와 이벤트 및 사용자 정의 이벤트를 수행하는 방법에 대해 생각하기 시작, 그래서 나는 더 독립이었다 더 나은 해답을 찾기 위해 노력했다. 트리거는 iframe을의 내용이 클릭 된 것을 주어진 이벤트 (JQuery와)에서 클릭 그냥 어떤 경우이기 때문에, 나는 모든 내가해야 할 일을했을 것이라고 생각했다. 따라서,이 내 솔루션이었다

   $(document).ready(function () {
       $("iframe").each(function () {
           //Using closures to capture each one
           var iframe = $(this);
           iframe.on("load", function () { //Make sure it is fully loaded
               iframe.contents().click(function (event) {
                   iframe.trigger("click");
               });
           });
   
           iframe.click(function () {
               //Handle what you need it to do
           });
       });
   });
   

3. ---

   3.그런 식으로, iframeTracker jQuery를 플러그인이를 사용해보십시오 :

   그런 식으로, iframeTracker jQuery를 플러그인이를 사용해보십시오 :

   jQuery(document).ready(function($){
       $('.iframe_wrap iframe').iframeTracker({
           blurCallback: function(){
               // Do something when iframe is clicked (like firing an XHR request)
           }
       });
   });
   

4. ---

   4.이것 좀 봐:

   이것 좀 봐:

   var iframe = $('#your_iframe').contents();
   
   iframe.find('your_clicable_item').click(function(event){
      console.log('work fine');
   });
   

5. ---

   5.당신은 다음과 같은 것을함으로써 초점 / 클릭 이벤트를 시뮬레이션 할 수 있습니다. () .blur 이벤트가 Iframe에 영향을 미치는 $ (창에서 적용)

   당신은 다음과 같은 것을함으로써 초점 / 클릭 이벤트를 시뮬레이션 할 수 있습니다. () .blur 이벤트가 Iframe에 영향을 미치는 $ (창에서 적용)

   $ (창) .blur (함수 () { // 체크 초점 (. $은 ( 'iframe이')가있다 ( '초점'))하는 경우 { CONSOLE.LOG ( "iframe이 집중"); $ (document.activeElement) .trigger ( "초점"); // 대신에 클릭 이벤트를 트리거 할 수 } 다른 { 을 console.log ( "iframe이는 산만"); } }); //테스트 $ ( '# iframe_id'). ( '초점', 기능 (전자) {에 CONSOLE.LOG (E); CONSOLE.LOG ( "안녕하세요 IM 집중"); })

6. ---

   6.제안 된 답변 중 아무도 나를 위해 일하지 않는다. 나는 비슷한 경우를 다음과 같은 방법으로 해결 :

   제안 된 답변 중 아무도 나를 위해 일하지 않는다. 나는 비슷한 경우를 다음과 같은 방법으로 해결 :

   <a href="http://my-target-url.com" id="iframe-wrapper"></a>
   <iframe id="iframe_id" src="http://something.com" allowtrancparency="yes" frameborder="o"></iframe>
   

   CSS를 (물론 정확한 위치의 앱 요구 사항에 따라 변경해야합니다) :

   #iframe-wrapper, iframe#iframe_id {
     width: 162px;
     border: none;
     height: 21px;
     position: absolute;
     top: 3px;
     left: 398px;
   }
   #alerts-wrapper {
     z-index: 1000;
   }
   

   물론 지금은 iframe이 래퍼에 어떤 이벤트를 잡을 수 있습니다.

7. ---

   7.당신은이 코드를 사용하여 바인드 iframe에있는 요소를 클릭 할 수 있습니다.

   당신은이 코드를 사용하여 바인드 iframe에있는 요소를 클릭 할 수 있습니다.

   jQuery를 ( '. class_in_iframe'jQuery를 ( '[ID = "id_of_iframe"]) [0] .contentWindow.document.body) CSTE 연구진은 ({() 함수를'클릭 ' 을 console.log ( "트리거!") });

8. ---

   8.이 Primefaces을 (CKEditor를 사용하는)를 사용하는 사람들을위한 흥미로운 일이 될 수 있습니다 :

   이 Primefaces을 (CKEditor를 사용하는)를 사용하는 사람들을위한 흥미로운 일이 될 수 있습니다 :

   document.getElementById('form:somecontainer:editor')
   .getElementsByTagName('iframe')[0].contentWindow
   .document.onclick = function(){//do something}
   

   나는 기본적으로 그냥 테크 가이 여행에서 답을했다하고 선택을 조금 변경 ..)

9. ---

   9.저를 위해 일하고 그 해결 방법 :

   저를 위해 일하고 그 해결 방법 :

   var editorInstance = CKEDITOR.instances[this.editorId];
   
               editorInstance.on('focus', function(e) {
   
                   console.log("tadaaa");
   
               });
   

10. ---

    10.당신은 아주 쉽게 해결 단지 래퍼에서 그 iframe을 포장하고 그 위에 클릭을 추적 할 수 있습니다.

    당신은 아주 쉽게 해결 단지 래퍼에서 그 iframe을 포장하고 그 위에 클릭을 추적 할 수 있습니다.

    이 같이 :

    해당

    iframe이 자체 비활성화 포인터 이벤트.

    #iframe_id {포인터 이벤트 : 없음; }

    이 변경 후 예상처럼 코드가 작동합니다.

    $ ( '#의 iframe_id_wrapper'). () {(기능을 클릭 // 실행 기능이 기록 클릭 });

from https://stackoverflow.com/questions/1609741/how-to-add-click-event-to-a-iframe-with-jquery by cc-by-sa and MIT license