on無法識別添加的鏈接元素

我正在創建一個以Google Maps Javascript API爲中心的應用程序，並使用了信息框插件。on無法識別添加的鏈接元素

創建信息框爲我的函數的代碼：

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用戶界面自動完成構件的另一個功能，它工作得很好：

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

來源

2017-06-19 Mr.Smithyyy

使用[委派事件處理（https://learn.jquery.com/events/event-delegation/） – James

@詹姆斯，這是他們在做什麼。 – trincot

@詹姆斯他是。我認爲這個問題與html內部的google地圖iframe有關。不完全確定。 – Goose

$（文件），而不是$（ '文件'） - 雖然這很可能是不會導致問題 - ＃2是。
這假定按鈕在頁面加載時位於DOM中。（「click」，「.adduser」，function（）{ alert（'hello world！'）; }）;

如果我正確閱讀您的標記和腳本，這不是正確的。所以，你不能綁定頁面加載後使用該方法的點擊事件。您將需要使用委派。

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

來源

2017-06-19 20:33:23 Korgrue

是不是代表已棄用贊成on？ –

是的 - 它實際上取代了其他幾種方法 - 但委託仍然工作得很好。 – Korgrue

on無法識別添加的鏈接元素

回答

相關問題