Функция Onclick на основе идентификатора элемента

Question

Я работаю над сайтом с визуализацией отношения наследования.

Я пытаюсь связать каждый узел с конкретными URL-адресами. HTML Элемента выглядит следующим образом:

<g class="node" id="RootNode" transform="translate(0,453.125)"> 

Я использовал

$('#RootNode').click(function(){//do something} 

а также

document.getElementById("RootNode").onclick(){//do something} 

Ни один из них не может найти элемент, ни установка функции OnClick.

Я что-то не понял? Любая информация будет полезна. Благодарю.

Answer 1

Убедитесь, что ваш код в DOM Ready как указано на rocket-hazmat

.click()

$('#RootNode').click(function(){ 
    //do something 
}); 

---

document.getElementById("RootNode").onclick = function(){//do something} 

---

.on()

Использование

$(document).on("click", "#RootNode", function(){ 
    //do something 
}); 

---

Попробуйте

Wrap код в Дом Ready

$(document).ready(function(){ 
    $('#RootNode').click(function(){ 
    //do something 
    }); 
}); 

Answer 2

вы можете попробовать это:

document.getElementById("RootNode").onclick = function(){/*do something*/}; 

или

$('#RootNode').click(function(){/*do something*/}); 

или

$(document).on("click", "#RootNode", function(){/*do something*/}); 

Существует точка для двух первых метода, который, это имеет значение, где на странице DOM, вы должны поместить их, весь DOM должен быть загружен, чтобы быть в состоянии найти , который, как правило, он получает решена, если вы заключите их в window.onload или DOMReady события, как:

//in Vanilla JavaScript 
window.addEventListener("load", function(){ 
    document.getElementById("RootNode").onclick = function(){/*do something*/}; 
}); 
//for jQuery 
$(document).ready(function(){ 
    $('#RootNode').click(function(){/*do something*/}); 
});