Question

所以我有一张表格，你得到了你已经完成的表格的百分比。问题出在其中一个输入上，即使它是空的，我得到一个结果。我不知道如何解决这个问题。继承人的代码

countMissing();

function countMissing() {

  //Get total inputs
  console.log("Total inputs " + form.getElementsByTagName('input').length);
  //Divide by complete inputs out of 100% and get percent
  console.log("The percentage is " + 100 / form.getElementsByTagName('input').length + "%");

  var tot = 100 / form.getElementsByTagName('input').length + "%"

  //Check
  var cback=function(){
    bad=0;
    $('.form :text').each(function (i,e) {
      if ($.trim($(e).val()) == "") bad++;

      //Change width
      $('.top').css('width', bad + '%');

    });
    //Missing amount of fields
    if (bad > 0) $('.congrats').css("display", "block").text(100/bad + ' Completed ');
    else $('.congrats').hide();
  }
  $(document).delegate('.form :text','focus',cback);
  $(document).delegate('.form :text','keyup',cback);
}

指向演示的链接http://jsbin.com/xijemuli/2/edit有任何想法吗？

Answer 1

我认为你需要指定.value（）。length（不确定它是否包含括号 - 来自内存：

form.getElementsByTagName（＆＃39;输入＆＃39）。value.length

Answer 2

FIDDLE ：http://jsfiddle.net/abdennour/3mH6w/3/

function count(){
   console.log("Total inputs " + $('.form :text').length);
//Divide by complete inputs out of 100% and get percent
console.log("The percentage is " + bad / $('.form :text').length + "%");

return 100-(bad / $('.form :text').length)*100 + "%"
}

更新：

另一个包含10个输入形式的示例：http://jsfiddle.net/abdennour/3mH6w/6/

Answer 3

我很确定你的代码试图杀死我的电脑。这是我采取的方法：

$('form').on('input', function(e) {

  var $inputs = $(this).find('input'),
      $empties = $inputs.filter(function(){
        return $.trim(this.value).length === 0;
      });

  $('.info').text($empties.length + ' of ' + $inputs.length + ' are empty!');

}).trigger('input');

以及一个小型演示：http://jsbin.com/gitef/4/edit?js,output

Answer 4

您的代码发生了一些事情，但您遇到的主要问题是计算百分比。

要查找剩余表格的百分比，数学是：

(total_fields - empty_fields / total_fields)

进行更改后（以及其他一些更改），您测试和运行的代码如下：

countMissing();

function countMissing() {
    var i = $('input').not('[type="button"]').length;

    var cback=function(){
        bad=0;
        $('.form :text').each(function (i,e) {
            if ($.trim($(e).val()) === "") bad++;
            $('.top').css('width', bad + '%');
        });
    // Missing amount of fields
    if (bad > 0) {
        $('.congrats').css("display", "block").text(((i - bad)/ i) * 100 + ' Completed ');
    } else {
        $('.congrats').hide();
    }

    $(document).delegate('.form :text','focus',cback);
    $(document).delegate('.form :text','keyup',cback);
}

空输入计数为满

4 个答案: