有没有办法在html中触发事件？

Question

有人能帮我一下吗。我正在尝试触发按钮post，应该调用该函数并显示内容

不工作(合并按钮时)

<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>

Answer 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);

Answer 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>

Answer 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>