Question

我必须从按钮的onlick属性内部的函数中获取参数值，但是利用此参数的函数（this.getListItemId(itemId)）不在上下文内部，按钮是。该按钮位于子功能内（this.renderVideoListTemplate()）位于父函数（getVideoListItems()）中。我想在onclick事件（this.getListItemId()）上调用的函数不在按钮（this.renderVideoListTemplate()）所在的位置，因此它说该函数（this.getListItemId(itemId)）不存在

var getVideoListItems = function() {
    var self = this;

    this.renderVideoListTemplate = function(result) {      

        for(let i=0; i < result.length; i++){  
    ====>>> var listItems ="<div class='Button fecharVideo' onclick='"+self.getListItemId(result[i].ID)+"'>"+ 
                                "<span class='Button'>Excluir Vídeo</span>"+
                            "</div>";

            $("#video-list-container").append(listItems);
        };
    };

    this.deleteListItem = function(webUrl, listName, itemId, success, failure) {
        self.getDataByItemId(webUrl,listName,itemId,function(item){
            $.ajax({
                url: item.__metadata.uri,
                type: "POST",
                headers: {
                    "Accept": "application/json;odata=verbose",
                    "X-Http-Method": "DELETE",
                    "If-Match": item.__metadata.etag
                },
                success: function (data) {
                    success();
                },
                error: function (data) {
                    failure(data.responseJSON.error);
                }
            });
        },
       function (error) {
           failure(error);
       });
    };

    this.getListItemId = function(itemId){
        self.deleteListItem(webUrl, listName, itemId)
    };

    return this.init();
}

Answer 1

您不能在onclick属性的字符串值内分配函数引用。

您可以通过使用委托事件处理程序来避免此问题并改善逻辑。您可以将result[i].ID保留在您创建的data的{{1}}属性中，单击事件发生时可以读取该属性。试试这个：

div

还请注意使用// in your object: this.renderVideoListTemplate = function(result) { var divs = result.map(function() { return `<div class="Button fecharVideo" data-id="${this.ID}"><span class="Button">Excluir Vídeo</span></div>` }); $("#video-list-container").append(divs); }; // somewhere else in your codebase: $('#video-list-container').on('click', '.fecharVideo', function(e) { e.preventDefault(); yourObjectReferece.getListItemId($(this).data('id')); })来构建一个字符串数组，以将其追加到map()元素一次，而不是在每次迭代中都添加。

Answer 2

首先是在开玩笑： SELECT geom FROM table WHERE ST_Contains(geom, ST_GeomFromEWKT(?)) 这个。将引用具有功能的Object（HTMLElement）。

第二：使用监听器的最佳方法是使用.addEventListener函数，例如： <a href'#' onclick='this.getListItemId(itemId)'>...

使用element.addEventListener（...与HTML分开的代码，方法更清晰，更易于操作和使用。顺便说一句，使用命名函数允许您删除EventListener，这将消除行为并简化代码编写方式。

Answer 3

我看到您在这里使用的是jQuery，您可以创建一个jQuery元素并使用$().on()添加一个侦听器，而不是使用简单的字符串

因此，此for loop：

        for(let i=0; i < result.length; i++){  
    ====>>> var listItems ="<div class='Button fecharVideo' onclick='"+self.getListItemId(result[i].ID)+"'>"+ 
                                "<span class='Button'>Excluir Vídeo</span>"+
                            "</div>";

            $("#video-list-container").append(listItems);
        };

可以转换为以下形式：

        for(let i=0; i < result.length; i++){  
            var listItems = $("<div class='Button fecharVideo'><span class='Button'>Excluir Vídeo</span></div>");
            listItems.on('click', function (){
                self.getListItemId(result[i].ID);
            });

            $("#video-list-container").append(listItems);
        };

如何在正确的上下文中传递函数以单击处理程序？

3 个答案: