如何制作按钮.单击“开始时不运行”
How to make button.onClick not run at start
我很困惑为什么我的函数会在按下启动按钮之前执行。我环顾四周,他们说如果你不这样做,onclick会在一开始运行,但在函数中单击按钮时要执行的代码。但我的功能。。。当按下启动按钮时,该代码应该创建4个按钮。但现在4个按钮马上出现。
编辑:这是完整的代码。
var log = document.getElementById("Log");
log.addEventListener("click", login); // Runs the Login Function
var email;
var password;
// Makes an alert to test input values.
function login() {
form = document.getElementById("form");
var text = "E-Mail: " + form.elements[0].value + " Password: " + form.elements[1].value;
alert (text);
}
// Testing Function
function helloWorld() {
alert ("Hello World");
}
//create the snake
function createSnake() {
var bodyLength = 5; //snake length
var body = []; //snake body
var head = [10, 10]; //snake head starting position;
// create the variables to edit for the body positions loop
var row = head[0];
var col = head[1];
// set the snake body positions
for (var i=0;i<bodyLength; i++) {
body[body.length] = [row, col];
var cord = row + "_" + col;
// Set the head Green
if (i == 0) { document.getElementById(cord).style.backgroundColor = 'green';
}
// Set the Body blue
else {document.getElementById(cord).style.backgroundColor = 'blue';}
row++;
}
}
var snakeBool = false; //Bool to test if the snake game has been pressed.
// Create a table function. Creates a gray table for Snake.
function createTable() {
if (!snakeBool) {
// create a table of data
//target the activity div
var activity = document.getElementById("activity");
//create table
var tbl = document.createElement("table");
//table styles
tbl.style.borderCollapse = "collapse";
tbl.style.marginLeft = '12.5px';
//create size var
//var size = '5px';
//set the row and column numbers
var tr_num = 30;
var td_num = 25;
//start the loops for creating rows and columns
for (var i = 0; i < tr_num; i++) {
var tr = document.createElement("tr"); // create row
//tr style
tr.style.height = '7px';
for (var j = 0; j < td_num; j++) { //start loop for creating the td
var td = document.createElement("td"); //create td
td.style.width = '5px';
if (i == 0 || i == (tr_num-1) || j == 0 || j == (td_num-1)) {
td.style.backgroundColor = "white";
}
else {
td.style.backgroundColor = "gray";
}
td.id = i + "_" + j; //set id to td
//td.appendChild("data"); //append data to td
tr.appendChild(td); //append td to row
}
tbl.appendChild(tr); //append tr to the table
}
activity.appendChild(tbl); //append the table to activity div
createSnake(); //Creates the snake body.
snakeBool = true; //Sets the Snake Bool to true since game has been created.
//create Start button
var b1 = document.createElement("input");
b1.type = "button";
b1.value = "Start";
b1.onClick = startGame;
activity.appendChild(b1);
} // end of if Function
}
function startGame() {
createButtons();
}
function createButtons() {
var b1 = document.createElement("input");
b1.type = "button";
b1.value = "Up";
//b1.onClick = func
activity.appendChild(b1);
var b2 = document.createElement("input");
b2.type = "button";
b2.value = "Down";
//b1.onClick = func
activity.appendChild(b2);
var b3 = document.createElement("input");
b3.type = "button";
b3.value = "Left";
//b1.onClick = func
activity.appendChild(b3);
var b4 = document.createElement("input");
b4.type = "button";
b4.value = "Right";
//b1.onClick = func
activity.appendChild(b4);
}
// when button is pressed, do createTable function
document.getElementById("gamesButton").addEventListener("click", createTable);
使用括号,您将立即调用startGame
函数。然后将其返回值分配给onClick
属性。
您很可能希望分配函数本身,因此它在onClick
事件触发时执行。为此,请更改此
b1.onClick = startGame();
到这个
b1.onClick = startGame;
相关文章:
- 在终端中运行 JavaScript 时(使用 rhino),如何使用 print() 函数在一行中打印
- 检查在使用节点运行程序时是否给出ARGV
- 在开始时隐藏FX.slide内容,而不是在单击后隐藏
- 拖动开始时更改可拖动元素的大小
- "无法获取/null”;当使用nodejs运行服务器时
- 运行POST时显示图像
- 安卓系统:通过loadUrl运行javascript时,网络视图中的视频会冻结
- "npm运行构建:css"不能工作,而当我自己运行脚本时是可以的
- ng中继器打印结果0;当我运行函数时
- 运行函数时出错
- 如何制作按钮.单击“开始时不运行”
- window.scroll在页面开始时触发
- 当我运行代码时,我得到以下结果 []对象对象] [对象对象],但应该给我一个有序数组
- AngularJS/Protactor:使用角种子基本应用程序运行量角器时出错
- 如何在父动画开始时激发jquery子函数
- 在ASP.Net中运行javascript时的执行顺序
- 滚动框滚动工作,但它在开始时返回
- 如何让Greasemonkey脚本在文档开始时在@run运行,在文档结束时在@run运行
- JavaScript代码在开始时运行一次,然后停止
- 如何在滚动开始时运行函数