OCX 與 JS 互調詳解

首先我們觀察一下項目的結構，方便後面操作

如上類視圖以及其他視圖都可以從下圖中找到答案

注意這個類視圖後面創建OCX 的Event事件要用到。

JS調用OCX

到上圖的類視圖 點添加事件

輸入參數名,點添加自動生成代碼

創建調度映射，讓外部JS能夠識別並調用

來到Ctrl.h文件中添加枚舉標誌

調試

// 給JS調用
int CMFCActiveXControl1Ctrl::beCallByJs(int param)
{
	MessageBox(_T("給JS調用"));
	return 10;
}

JS中

function test3(param)  
{  
   document.getElementById("jssTest1").beCallByJs(1);  
}  

OCX調用JS

添加事件，跟上面一樣打開類視圖

這裏是用VS2013添加的，VS2017點添加會提示必須加入Event的問題，比較奇葩。

idl中的事件申明

ctrl.h中實現

不過不要慌，這些都是自動生成的，當然看下也好，玩意什麼時候要自己動手呢。

調用

CallJSBackEvent(_T("草泥馬"));

JS響應
方式一:attachEvent

window.onload =function(){
	alert("加載完畢，加載ocx事件");
	document.getElementById("jssTest1").attachEvent("CallJSBackEvent",test2); 		}
function test2(param)  {  
        alert("事件回傳"+param)
}  

方式二:script

<script language="javascript" for="jssTest1" event="CallJSBackEvent(p)" type="text/javascript"> 
	//alert("回調函數發現:" + p); 
	test2(p);
</script>

注意

注意一、

使用Edge的話attachEvent是不生效的

注意二、
attachEvent和Script方式同時使用是不會被覆蓋的，均會被調用

其他

一、關於IE不能調試的問題，直接下載一個插件即可
參考：https://www.cnblogs.com/cxying93/p/6586694.html

二、codebase 無需註冊直接安裝ocx

效果

三、卸載

regsvr32 /u 文件路徑

四、AfxBeginThread

五、查看函數
這樣我們再調試中就可以看到OCX的公開函數了

調試代碼如下：

var ocx = new ActiveXObject("ACTIVEXDEMO.ActiveXDemoCtrl.1");
var test = ocx.ShowEdit("草泥馬");

源代碼

關注公衆號

回覆
互調 或 OCX
獲取

還有更多幹貨分享…