Question

我正在创建一个以Google Maps Javascript API为中心的应用程序，我正在使用信息框插件。

创建信息框的我的函数代码：

var ibOptions = {
    disableAutoPan: false,
    zIndex: null,
    infoBoxClearance: new google.maps.Size(1, 1),
    pixelOffset: new google.maps.Size(-85, -290),
    isHidden: false,
    pane: "floatPane",
    enableEventPropogation: true
};


let marker = new google.maps.Marker({
    icon: icon,
    map: map,
    draggable: true,
    position: new google.maps.LatLng(latlng.lat, latlng.lng),
    visible: true
});

boxText.innerHTML = "<input type='text' id='user' placeholder='Add User' />"
                    + "<a href='#' class='adduser'>Add User</a>";
ibOptions.content = boxText;

let ib = new InfoBox(ibOptions);

ib.open(map, marker);

然后在另一个函数中，我试图捕获信息框内按钮的点击但没有发生任何事情。控制台中没有错误，也没有警报。我可以在我的adduser函数中记录一些简单的消息，所以我知道其他一切都正常工作，我确实导入了jQuery。

export function addUser() {
    $("document").on("click", ".adduser", function () {
        alert('hello world!');
    });
};

我有另一个调用jquery ui自动完成小部件的函数，它可以正常工作：

$("#user").autocomplete({
    source: userArray
});

Answer 1

$（文件），而非$（'文件'） - 虽然这可能不会导致问题 - ＃2是。
这假设按钮在页面加载时位于DOM中。 $（“document”）。on（“click”，“。adduser”，function（）{ 警报（'你好世界！'）; }）;

如果我正确地阅读您的标记和脚本，那不是。因此，在使用该方法加载页面后，您无法绑定单击事件。您将需要使用委托。

$('#yourButtonWrapper').delegate('.adduser', 'click', function() { 
  alert('hello world!');
});

on无法识别添加的链接元素

1 个答案: