, как отметили другие, оба из них будут работать:
<script>
$('body').on('click', '#bmw', function() {
alert('i like bmw');
});
$(document).on('click', '#bmw', function() {
alert('i like bmw');
});
</script>
Оба они работают, привязываясь к телу или документу и прослушивая события щелчка с помощью селектора #bmw, который всплывает им. Хорошей идеей будет охватить их чем-то, что не является телом или документом, если вам не нужна вся страница, чтобы узнать об этом клике. Это будет работать только в том случае, если у вас есть привязка в DOM, прежде чем пытаться связать ваш обработчик кликов (что похоже на то, что вы делаете).
, поэтому при условии, что у вас есть подобный макет перед загрузкой ваших скриптов:
<html>
<body>
<div id="cars"></div>
</body>
</html>
Я бы порекомендовал написать скрипт для обработки кликов следующим образом:
$('#cars').on('click', '#bmw', function(){
alert('I like bmw');
});
Однако если вы хотите поднять свое решение на новый уровень, я предлагаю использовать общий класс :
<script>
$('#cars').append('<input type="button" class="car-button" id=' + car[i] + '>');
$('#cars').on('click', '.car-button', function(){
var id = $(this).attr('id');
var alertText = 'I like ' + id;
alert(alertText);
});
</script>
Теперь, если вы действительно хотите поклониться, сделайте то, что предложили другие, и поместите этот скрипт в свой документ. Я также предпочитаю использовать функцию закрытия функций, чтобы предотвратить утечку глобальных переменных и предотвратить столкновения:
<script>
(function ($) {
$(document).ready(function () {
$('#cars').append('<input type="button" class="car-button" id=' + car[i] + '>');
$('#cars').on('click', '.car-button', function(){
var id = $(this).attr('id');
var alertText = 'I like ' + id;
alert(alertText);
});
});
})(jQuery);
</script>