Есть ли способ вызвать событие в html

#javascript #html

Вопрос:

Кто-нибудь может мне здесь помочь. Я пытаюсь запустить сообщение кнопки, которое должно вызывать функцию и отображать содержимое

Не работает (когда кнопка включена)

 <button id="alert" type="button">Calling car properties</button>
<script>
document.getElementById("alert").onclick = function car(seats,engine,theradio) {
this.seats=seats;
this.engine=engine;
this.theradio=theradio;
var work_car= new car("cloth","V-7","Tape Deck");
var fun_car= new car("leather","V-8","C Player");
var engine_type= work_car.engine;
var seat_type= fun_car.seats;
var radio_type= fun_car.theradio;
document.write("I want a car with " seat_type " seats.<br />");
document.write("It also needs a " engine_type " engine.<br />");
document.write(radio_type);

var number = Math.random();
document.write("It also needs a " number " engine.<br />");
}
</script>
 

работа без кнопки

 <script>
function car(seats,engine,theradio) {
this.seats=seats;
this.engine=engine;
this.theradio=theradio;
}
var work_car= new car("cloth","V-7","Tape Deck");
var fun_car= new car("leather","V-8","C Player");
var engine_type= work_car.engine;
var seat_type= fun_car.seats;
var radio_type= fun_car.theradio;
document.write("I want a car with " seat_type " seats.<br />");
document.write("It also needs a " engine_type " engine.<br />");
document.write(radio_type);

var number = Math.random();
document.write("It also needs a " number " engine.<br />");
</script>
 

Комментарии:

1. судя по коду, у вас переполнение стека

2. Определите «не работает». Обратите внимание, что это document.write может быть не лучшим подходом-это может быть то, что вы намереваетесь, но это редко бывает так.

3. Вы привязываете именованную функцию конструктора вашего «автомобиля» к onclick. Его следует оставить в покое, и onclick скорее должен быть другой и анонимной функцией, которая его использует.

4. @Тобиас. Извини, что не понял тебя

5. У вас есть именованная функция car . Внутри функции, которую вы вызываете, функция car . Внутри функции, которую вы вызываете, функция car . Внутри….

Ответ №1:

Как упоминалось в комментарии, вы вызываете car функцию рекурсивно. Чтобы устранить проблему, просто переименуйте имя onclick события и сохраните car функцию.

         function car(seats, engine, theradio) {
            this.seats = seats;
            this.engine = engine;
            this.theradio = theradio;
        }

        document.getElementById("alert").onclick = function event() {
            
            var work_car = new car("cloth", "V-7", "Tape Deck");
            var fun_car = new car("leather", "V-8", "C Player");
            var engine_type = work_car.engine;
            var seat_type = fun_car.seats;
            var radio_type = fun_car.theradio;
            document.write("I want a car with "   seat_type   " seats.<br />");
            document.write("It also needs a "   engine_type   " engine.<br />");
            document.write(radio_type);

            var number = Math.random();
            document.write("It also needs a "   number   " engine.<br />");
        } 
   <button id="alert" type="button">Calling car properties</button> 

Еще одна важная вещь, которую вы должны заметить, заключается document.write в следующем . вероятно, лучший способ-создать тег и добавить его в тело. Подобный этому:

 var div1 = document.createElement("div");
div1.innerHTML = "I want a car with "   seat_type   " seats.<br />";

document.body.append(div1);
 

Комментарии:

1. привет, Али, я тоже пытался, как ты и сказала. Но не работает. Только что опубликовал код здесь. Пожалуйста, обратитесь

2. Пожалуйста, поставьте button метку перед script меткой

3. Я тоже пытался это сделать. немного не работает. Пожалуйста, посмотрите мой код 🙂

4. Вы можете нажать на кнопку Run code snippet и увидеть, что все в порядке.

5. это работает здесь. Но тот же код, который я скопировал, но не работает 🙁 Позвольте мне проверить

Ответ №2:

Отредактированный

 <script>
function car(seats, engine, theradio) {
            this.seats = seats;
            this.engine = engine;
            this.theradio = theradio;
        }

        document.getElementById("alert").onclick = function event() {
            debugger
            var work_car = new car("cloth", "V-7", "Tape Deck");
            var fun_car = new car("leather", "V-8", "C Player");
            var engine_type = work_car.engine;
            var seat_type = fun_car.seats;
            var radio_type = fun_car.theradio;
            document.write("I want a car with "   seat_type   " seats.<br />");
            document.write("It also needs a "   engine_type   " engine.<br />");
            document.write(radio_type);

            var number = Math.random();
            document.write("It also needs a "   number   " engine.<br />");
        }
        </script>
<button id="alert" type="button">Calling car properties</button>
 

Комментарии:

1. Подумайте о том, чтобы добавить объяснение того, для чего предназначен ваш код. Это полезно для людей, приходящих к вопросу, чтобы помочь им понять, что это значит.

Ответ №3:

Добавлена кнопка перед сценарием

 <script>
function car(seats, engine, theradio) {
            this.seats = seats;
            this.engine = engine;
            this.theradio = theradio;
        }

        document.getElementById("alert").onclick = function event() {
            debugger
            var work_car = new car("cloth", "V-7", "Tape Deck");
            var fun_car = new car("leather", "V-8", "C Player");
            var engine_type = work_car.engine;
            var seat_type = fun_car.seats;
            var radio_type = fun_car.theradio;
            document.write("I want a car with "   seat_type   " seats.<br />");
            document.write("It also needs a "   engine_type   " engine.<br />");
            document.write(radio_type);

            var number = Math.random();
            document.write("It also needs a "   number   " engine.<br />");
        }
        
<button id="alert" type="button">Calling car properties</button>
</script>

  

 

Комментарии:

1. Это неверно. вы вставляете свою кнопку в тег скрипта! Пожалуйста, поместите button тег в тег тела, а затем поместите тег сценария

2. Пожалуйста, не публикуйте несколько ответов.