关于javascript:如何使用原生的-JavaScript-代码触发-SAP-UI5-按钮控件的点击事件处理函数

我的技术交换群里，有敌人发问：

我有个 UI5 按钮，想用原生 js 去触发 click 事件。在 dom 上检测到 click 曾经触发了，然而按按钮的动作响应没有产生。请问如何解决，谢谢。

解决这个问题的理论依据：深刻学习 SAP UI5 框架代码系列之三：HTML 原生事件 VS UI5 Semantic 事件

我写了一个简略的 SAP UI5 利用，index.html 的残缺代码贴在本文开端。

第一个按钮的点击事件处理函数，逻辑为在其显示文本的开端增加 1，比方触发一次后，button text 显示为 Button 11，顺次类推。

见第 33 行代码。拿到第一个 button 实例后，间接调用 SAP UI5 API firePress，触发第一个按钮的事件点击处理函数。

见下图第 45～46 行：

两种形式均能依照冀望触发第一个按钮的点击事件处理函数，成果如下视频所示：

https://www.zhihu.com/zvideo/…

本利用的残缺代码如下：能够应用 Jerry 文章一个用于 SAP UI5 学习的脚手架利用，没有任何后盾 API 的依赖提到的脚手架利用运行。

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="utf-8">
    <title>SAPUI5 Sandbox</title>
    <script
        id="sap-ui-bootstrap"
        src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
        data-sap-ui-theme="sap_belize"
        data-sap-ui-libs="sap.ui.commons"
        data-sap-ui-compatVersion="edge"
        data-sap-ui-preload="async">
    </script>
    <script>
        sap.ui.getCore().attachInit(function () {
            var oButton1 = new sap.ui.commons.Button({
                text : "Button 1",
                tooltip : "This is a test tooltip",
                press : function() {var origin = oButton1.getText();
                    oButton1.setText(origin + '1');
                }
            });

            var oButton2 = new sap.ui.commons.Button({
                text : "用 SAP UI5 API 触发第一个按钮的点击处理函数",
                tooltip : "This is a test tooltip",
                press : function() {var origin = oButton2.getText();
                    oButton2.setText(origin + '2');

                    oButton1.firePress();
                    debugger;
                }
            });

            var oButton3 = new sap.ui.commons.Button({
                text : "用 js 原生 API 触发第一个按钮的点击处理函数",
                tooltip : "This is a test tooltip",
                press : function() {var origin = oButton2.getText();
                    oButton3.setText(origin + '3');

                    var a = document.getElementById("__button0");
                    a.click();}
            });

            var oVerticalLayout = new sap.ui.layout.VerticalLayout();
            oVerticalLayout.addContent(oButton1);
            oVerticalLayout.addContent(oButton2);
            oVerticalLayout.addContent(oButton3);
        /*var oModel = new sap.ui.model.json.JSONModel();
        var myData = {"field_for_text": "Jerry"};

        oModel.setData(myData);
        oButton1.setModel(oModel);
        oButton1.bindProperty("text", "/field_for_text", undefined, "OneTime");

        myData["field_for_text"] = "Tom";
        oModel.checkUpdate();

        oButton1.attachEvent("_change", function(oEvent) {var oChangeDetail = oEvent.getParameters();
              debugger;
          });*/
        oVerticalLayout.placeAt("content");
        });
    </script>
</head>
<body class="sapUiBody" role="application">
    <div id="content"></div>
</body>
</html>

更多 Jerry 的原创文章，尽在：” 汪子熙 ”:

关于javascript:如何使用原生的-JavaScript-代码触发-SAP-UI5-按钮控件的点击事件处理函数

办法 1：应用 SAP UI5 API 触发第一个 button 的点击事件处理函数

办法 2：应用 JavaScript 原生 API 触发第一个 button 的点击事件处理函数