用于组合循环、文本、复选框和结果的JavaScript代码

JavaScript code for combining for loop, text, checkboxes, result

本文关键字：结果 JavaScript 代码 复选框 组合 循环 文本 用于      更新时间：2023-09-26

我正试图完成一个JavaScript类的练习，但我对代码的顺序感到困惑。练习是这样的：我们在表格中收集调查信息。说明：使用for循环来找出选中了哪些复选框（用户最多可以选择4个），并在结果消息中显示它们的值。复选框的选项有红色、蓝色、橙色和紫色。

任何人能提供的帮助都将不胜感激。这是我在stackOverflow上的第一个问题，如果我没有遵守所有准则，请原谅。非常感谢。

以下是基本步骤（按顺序）：

  1. 从DOM中获取一个复选框列表（这将产生一个DOM对象数组）
  2. 使用for循环遍历数组，以计数选中了多少复选框
  3. 显示计数

具体如何执行步骤1取决于您所拥有的HTML，因此您必须先发布HTML，然后我们才能提供更具体的建议（不要胡乱猜测）。

使用for循环只不过是使用for循环的数组的基本迭代。你应该能够在课程材料中找到如何做到这一点，其中涵盖了for循环。

可以通过多种方式显示计数。最简单的方法是使用alert()消息。

这里有一个草图：

var checkboxes = { 
  red: getElementByID('red'),
  blue: getElementByID('blue'),
  orange: getElementByID('orange'),
  purple: getElementByID('purple')
};
var resultMessage = "";
for (var name in checkboxes) {
  resultMessage += name + ": " + checkboxes[name].selected + "'n";
};
alert(resultMessage);

getElementByID是一个示例方法，您需要提供自己的方法。

这里有一个简单的方法：http://jsfiddle.net/V5a8V/

这是一个实时演示：http://jsfiddle.net/DerekL/qvvLQ/

非常简单。

我使用jQuery是因为它更容易使用：（这是的一部分）

function findIt(){
    var ele=$("input"),                 //get all checkboxes
        obj={};                         //create an object that store information
    for(var i=0;i<ele.length;i++){
        var e=ele[i];
        obj[$(e).attr("value")]=e.checked;   //store data in obj
    }
    for(key in obj){
        alert(key+": "+((obj[key])?"Checked":"Not checked"));    //recall it
    }
}​

您也可以在另一个function中使用obj来做其他事情。
现场演示：http://jsfiddle.net/DerekL/qvvLQ/

相关文章：