首页 > 解决方案 > 基于SAPUI5中html元素的点击事件执行功能

问题描述

嗨,当我按下图片的特定区域时,我正在尝试让控制器中定义的函数执行。我正在使用 html 地图来定义我的图片区域(下面的代码)

<mvc:View id="Main" controllerName="Demo.picture.controller.Main" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc"
displayBlock="true" xmlns="sap.m" xmlns:core="sap.ui.core">
<App id="idAppControl">
    <pages>
        <Page title="{i18n>title}">
            <content>
                    <Image src = "Some image source" alt="Image" useMap="Map"/>
            </content>
        </Page>
    </pages>
</App>
<html:map name="Map" id="Map">
    <html:area id= "area_1" shape="rect" coords= "0,0,240,215" alt="Chart" onclick="???"/>
    <html:area id = "area_2" shape="rect" coords="240,0,480,215" alt="Start" onclick="???"/>
</html:map> </mvc:View>

不确定使用 onclick 是否是正确的方法。

控制器代码:

sap.ui.define([

"sap/ui/core/mvc/Controller"], function (Controller) {
"use strict";

return Controller.extend("Demo.picture.controller.Main", {


    SomeMethodFoo: function () {
        "method to be executed when area_1 is pressed"
    },

    SomeMethodGoo: function () {
        "method to be executed when area_2 is pressed"
    }

});});

是否可以将 onclick 事件的 eventHandler 附加到这些区域?还是有其他方法可以做到这一点?

标签: sapui5

解决方案


我想它会是这样的:

onclick="sap.ui.getCore().byId('__xmlview0').getController().SomeMethodFoo()"

但是您需要管理自己以了解您的视图 ID,这并不总是 '__xmlview0'


推荐阅读