我已经查看这段代码很长时间了,试图解决这个问题,但我没有运气。这个问题是我想给参数boxId赋值。当我点击网页中的一个框时,会出现一个显示该 ID 的警报。我尝试了很多东西,但似乎没有任何效果。我是初学者,所以我觉得在这一点上一定有一些我不知道该怎么做的事情。
构造函数:
function Box (boxId, name, color, number, coordinates) {
this.boxId = boxId;
this.name = name;
this.color = color;
this.number = number;
this.coordinates = coordinates;
}
全局变量:
var boxes = [];
var counter = 0;
var boxId = 0;
初始化函数:
window.onload = init;
function init() {
var generateButton = document.getElementById("generateButton");
generateButton.onclick = getBoxValues;
var clearButton = document.getElementById("clearButton");
clearButton.onclick = clear;
}
获取值和创建新框的函数:
function getBoxValues() {
var nameInput = document.getElementById("name");
var name = nameInput.value;
var numbersArray = dataForm.elements.amount;
for (var i = 0; i < numbersArray.length; i++) {
if (numbersArray[i].checked) {
number = numbersArray[i].value;
}
}
var colorSelect = document.getElementById("color");
var colorOption = colorSelect.options[colorSelect.selectedIndex];
var color = colorOption.value;
if (name == null || name == "") {
alert("Please enter a name for your box");
return;
}
else {
var newbox = new Box(boxId, name, color, number, "coordinates");
boxes.push(newbox);
counter++;
var boxId = counter;
}
addBox(newbox);
var data = document.getElementById("dataForm");
data.reset();
}
向页面添加框的函数:
function addBox(newbox) {
for (var i = 0; i < newbox.number; i++) {
var scene = document.getElementById("scene");
var div = document.createElement("div");
div.className += " " + "box";
div.innerHTML += newbox.name;
div.style.backgroundColor = newbox.color;
var x = Math.floor(Math.random() * (scene.offsetWidth-101));
var y = Math.floor(Math.random() * (scene.offsetHeight-101));
div.style.left = x + "px";
div.style.top = y + "px";
scene.appendChild(div);
div.onclick = display;
}
}
单击框时显示警报的功能:
function display(e) {
var a = e.target;
alert(a.counter);
}
清除框的功能:
function clear() {
var elems = document.getElementsByClassName("box");
for ( k = elems.length - 1; k >= 0; k--) {
var parent = elems[k].parentNode;
parent.removeChild(elems[k]);
}
}
所有其他功能都可以正常工作。对于我尝试过的所有操作,当我单击它时,我一直遇到显示为“未定义”的 ID,或者在控制台日志中计数器显示为“0”。
最佳答案
你可以这样做。
首先,在 addBox() 中嵌入 boxId 作为标签的属性,如下所示:
div.setAttribute('data-boxId', newbox.boxId);
然后在 display() 中你可以取回它:
alert(e.target.getAttribute('data-boxId'));
如果您不喜欢这种方法,请告诉我,我会发布替代方法(关闭内容)。
编辑: 添加 jsfiddle 示例 http://jsfiddle.net/runtarm/8FJpU/
关于javascript - 为对象javascript分配参数值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14386807/