OpenLaszlo <html> 태그/iframe 통합 및 JavaScript 호출

삽입하는 html 데이터에 자바 스크립트 함수를 하나씩 표시하려고하는데 오류가 발생합니다. getLoaded는 메소드가 아닙니다. 코드 스 니펫을 첨부했습니다. 뭐가 잘못 되었 니 ?OpenLaszlo <html> 태그/iframe 통합 및 JavaScript 호출

<canvas width="100%" height="100%" > 
     <simplelayout axis="y" spacing="2"/> 
      <button>Set HTML 
       <handler name="onclick"> 
        <![CDATA[ 
        if (canvas.main) { 
         canvas.main.setAttribute('html', '<html><head><style type="text/css">body {background-color: #ffffff;}</style><script>function getLoaded(){ return document.images.length;}</script></head><body><img id="imageTag" ></img></body></html>'); 
        } 
        ]]> 
       </handler> 
      </button> 

       <button>test 
       <handler name="onclick"> 
        <![CDATA[ 
        if (canvas.main) { 
         var del = new LzDelegate(this,'handlerFunc'); 
         canvas.main.callJavascript('getLoaded',del); 
        } 
        ]]> 
       </handler> 
      </button> 
      <method name="handlerFunc" args="retVal"> 
       console.log("handlerFunc", retVal); 
      </method> 

     <html name="main" x = "50" y="50" width="600" height="400" > 
      <handler name="oninit"> 
       this.bringToFront(); 
      </handler> 

     </html> 

</canvas>

출처

2012-10-16 karthick

SWF 또는 DHTML 런타임을 사용하고 있습니까? –

@ RajuBitter : swf 환경을 사용하고 있습니다. – karthick

SWF 런타임도 지원하도록 예제를 업데이트했습니다. –

여기는 SWF10 및 DHTML 런타임 모두에서 작동하는 솔루션입니다. IE 9, Firefox 및 Chrome을 테스트했습니다.

1) HTML는 전체 HTML 문서 구조를 포함해서는 안 <HTML> 태그의 @html 속성에 할당하는 니펫을 :

은 당신의 코드에 두 가지 문제가있다. 당신이 볼 수 있듯이

,setHTML: function(id, html) { 
    // must be called after the iframe loads, or it will be overwritten 
    if (html) { 
     var win = lz.embed.iframemanager.getFrameWindow(id); 
     if (win) { 
      win.document.body.innerHTML = html; 
     } 
    } 
}

, html로 매개 변수의 값이 innerHTML을 할당한다 : 여기에있는 iFrame에 HTML 코드를 할당하는 데 사용되는 iframemanager.js 라이브러리에서 자바 스크립트 (오픈 라즐로의 일부)입니다 본문 요소의 따라서 생성하는 HTML 문서의 본문 만 포함하면 충분합니다.

2) JavaScript 섹션을 iFrame에 추가하려는 경우 문서에 할당하려는 HTML 코드로 인라인 할 수 없지만 전체 예제에서 볼 수있는 것처럼 'script'요소를 만들어야합니다 이하. SWF 런타임을 지원하려는 경우 가장 효율적인 방법은 작은 외부 JavaScript 함수를 만드는 것입니다.이 함수는 아래와 같이 도우미 함수를가집니다.

이 솔루션을 위해 만드는 파일은 두 가지입니다. LZX 파일 및 외부 JavaScript 파일 iFrameHelperFunction.js. 여기

이 LZX 파일의 수정 된 버전입니다 :

<canvas width="100%" height="100%" > 

    <wrapperheaders> 
    <script type="text/javascript" src="iFrameHelperFunction.js"></script> 
    </wrapperheaders> 

    <simplelayout axis="y" spacing="2"/> 

    <button>Set HTML 
    <handler name="onclick"> 
    <![CDATA[ 
     if (canvas.main) { 
      // Create the HTML content; do not include <html><head><body> structure here, 
      // since setting the 'html' attribute of an OpenLaszlo <html> tag will set 
      // the innerHTML property of the iFrame's document.body. 
      var innerHTML = '<style type="text/css">body {background-color: #ff0000;}</style>' 
        + '<img id="imageTag" src="https://www.google.com/images/srpr/logo3w.png"></img>', 
       jsCode = "function getLoaded() { alert('inside getLoaded()'); return 'getLoaded was called'; }"; 
      canvas.main.setAttribute('html', innerHTML); 
      lz.Browser.callJS('addJavaScriptToFrame("' + canvas.main.iframeid + '", ' + jsCode + ')'); 
     } 
     ]]> 
    </handler> 
    </button> 

    <button>test 
    <handler name="onclick"> 
    <![CDATA[ 
     if (canvas.main) { 
     var del = new LzDelegate(canvas, 'handlerFunc'); 
     canvas.main.callJavascript('getLoaded', del); 
     } 
    ]]> 
    </handler> 
    </button> 

    <method name="handlerFunc" args="retVal"> 
    Debug.info("handlerFunc", retVal); 
    </method> 

    <html name="main" x = "50" y="50" width="600" height="200" > 
    <handler name="oninit"> 
     this.bringToFront(); 
    </handler> 
    </html> 

</canvas>

첫째, 나는 내 사용자 지정을 추가 해요 페이지에 자바 스크립트 파일 :

<wrapperheaders> 
    <script type="text/javascript" src="iFrameHelperFunction.js"></script> 
    </wrapperheaders>

는 그 다음 iframe 대응 냈다되는 HTML입니다 귀하의 코드와 유사하게 설정하십시오.

lz.Browser.callJS('addJavaScriptToFrame("' + canvas.main.iframeid + '", ' + jsCode + ')');

function addJavaScriptToFrame(frameId, jsCode) { 
    var iframeWin = lz.embed.iframemanager.getFrameWindow(frameId); 
     doc = iframeWin.document; 

    // Scripts can not be inlined in HTML snippets, but must be created through JavaScript 
    var scriptEl = doc.createElement('script'); 
    // The JavaScript function or code you want to add 
    scriptEl.text = jsCode; 

    // Append the script to the head of the iFrame document 
    doc.firstChild.appendChild(scriptEl); 
}

LZX 파일에 iframe이에 자바 스크립트를 추가하는 전화 :하지만 iframe이 HTML 페이지에 추가되는 모든 자바 스크립트는 iFrameHelperFunction.js에 정의 된 도우미 함수 addJavaScriptToFrame를 사용하여 추가해야합니다

"HTML 설정"버튼을 클릭하여 프레임의 내용을 설정 한 다음 "테스트"버튼을 클릭하여 iFrame 내부의 getLoaded() 함수를 호출합니다.

Example OpenLaszlo app with iFrame content set dynamically through JavaScript

출처

2012-10-17 16:07:49

OpenLaszlo <html> 태그/iframe 통합 및 JavaScript 호출

답변

관련 문제