Javascript 如何在单击“计算”之前检查所有文本框是否为空

大家好，我是jscipt的新手，，，嗯，老实说，编程一般来说都很简单，但是个人使用的学习速度很慢。 我寻求指南，了解如何将索引文件中的所有文本框（输入）放入列表容器，在单击“计算”按钮之前循环检查它们是否为空。如果它们是空的，则通知用户哪一个是空的。 此外，是否有办法防止用户只在文本框和数字中输入文本。 背景：我正在创建一个表单，要求所有字段都填充数字（以小时为单位），然后将根据这些值生成一个图形。 我将文件放在skydrive中，供大家通过下面的链接下载

我确实尝试了以下方法，但无论texbox是否填充，这都会提醒我

function checkInputsGenerateGraph()
{
if( $('#hutz-hoursInput').val() == ""||$('#hutz-weeksPerYearInput').val() ==      ""||$('#hutz-jobsPerWeekInput').val() == ""||$('#hutz-hourlyMachineRateInput').val() == ""||$('#hutz-maintneneceDowntimeInput').val() == ""||$('#hutz-scrapRateInput').val() == ""||$('#hutz-toolsPerJobInput').val() == ""||$('#hutz-timeToLoadToolInput').val() == ""||$('#hutz-timeToSetPartsInput').val() == "")
{
alert('One them is empty!!');
}
else
{
$("#hutz-graph").slideDown();  
                    $("#hutz-lblImproveMyProcess").slideUp();
                    $("#hutz-hoursInput").slideUp();
                    $("#hutz-weeksPerYearInput").slideUp();
                    $("#hutz-jobsPerWeekInput").slideUp();
                    $("#hutz-ourlyMachineRateInput").slideUp();
                    $("#hutz-ntneneceDowntimeInput").slideUp();
                    $("#hutz-scrapRateInput").slideUp();
                    $("#hutz-toolsPerJobInput").slideUp();
                    $("#hutz-timeToLoadToolInput").slideUp();
                    $("#hutz-timeToSetPartsInput").slideUp();
                    $("#hutz-lblMachineDetails").slideUp();
                    $("#hutz-lblPartSetting").slideUp();
                       $("#hutzcurrencyPreferenceInput").slideUp();
                    createChart();                      
}
}

---

首先，给所有必需的元素一个公共类，例如，我们称之为

必需的
：

<input type="text" class="required" id="hutz-hoursInput" />

您还可以执行以下操作，从输入中删除所有非数字：

$('.required').change(function() {
  this.value = this.value.replace(/[^\d]+/, '');
});


希望这能为你指明正确的方向

编辑

下面是一个完整的示例：-

function checkInputsGenerateGraph() {

  var isValid = true;

  $('.example').each(function() {
    if (this.value.length == 0) {
      alert(this.id + ' is empty!');
      isValid = false; 
    } 
  });

  if (isValid) {
    alert('do calculations!');   
  }
}

因此，首先循环所有元素，并确保它们都已填充。如果不是，请将
isValid
设置为false，以便在循环完成后不执行计算
 非常感谢billy，我这样做了，但在if语句中包含了一个else（而不是else if），表示它们是否已填充，然后滑动所有内容并显示图表，但是，如果其中一个文本框为空，则警报将显示，这很好，但图表仍将显示。我遗漏了什么吗？@user1996641检查，你需要在循环完成后运行你的计算函数，否则每次值不是空的时候它都会触发：）没问题，很高兴我能帮忙我在网上找不到任何地方如何设置表单的宽度和高度，你能帮忙吗？我需要把它固定在1024x768
function checkInputsGenerateGraph() {

  var isValid = true;

  $('.example').each(function() {
    if (this.value.length == 0) {
      alert(this.id + ' is empty!');
      isValid = false; 
    } 
  });

  if (isValid) {
    alert('do calculations!');   
  }
}