禁用提交按钮，直到所有隐藏的输入有一个值

Question

我有一个隐藏输入的简单表单，我试图检查每个隐藏的输入是否有一个值。如果所有隐藏的输入都有一个值，而不是禁用或启用提交按钮。一旦用户通过jquery点击图像，输入就会被填充。香港专业教育学院尝试多种方式，它看起来像我想的东西....

<form method="post" action="test.php"> 
    <div class="selections" id="accordion"> 
     <h3>title<div class='status'>Pending</div></h3> 
     <div class='select-form'> 
      <div class='images'> 
       <img src='images/vote.jpg' data-value='data-value'> 
       <br/><span>title</span><br/>description 
      </div> 
      <input type='hidden' class='image-value' name='1' value=''> 
     </div> 
     <div class='select-form'> 
      <div class='images'> 
       <img src='images/vote.jpg' data-value='data-value2'> 
       <br/><span>title</span><br/>description 
      </div> 
      <input type='hidden' class='image-value2' name='2' value=''> 
     </div> 
    </div> 
    <input id="submit_button" type="submit" class="submit" value="SUBMIT"> 
</form> 

的JavaScript去如下：

$(document).ready(function() { 
    var $submit = $("input[type=submit]"), 
     $inputs = $('input[type=hidden]'); 

    function checkEmpty() { 

     // filter over the empty inputs 

     return $inputs.filter(function() { 
      return !$.trim(this.value); 
     }).length === 0; 
    } 

    $inputs.on('blur', function() { 
     $submit.prop("disabled", !checkEmpty()); 
    }).blur(); // trigger an initial blur 


}); 

什么想法？

Answer 1

你可以只调用checkEmpty()上img.click()，并从该函数处理禁用状态。

尝试一下这里：JSFiddle（点击图片）

$(document).ready(function() { 
    var $submit = $("input[type=submit]"), 
     $inputs = $('input[type=hidden]'); 

    function checkEmpty() { 
     var res = true; 
     $inputs.each(function(i,v){ 
      if(v.value == ""){ 
       res = false; 
       return false; 
      } 
     }); 

     $submit.prop("disabled", !res);  
    } 

    $("img").click(function(){ 
     $(this).parent().parent().find("input[type=hidden]").val("sdf"); 
     checkEmpty(); 
    }); 

    checkEmpty(); //set disabled onload 
}); 

Answer 2

，你接受你的装饰功能不正常，请删除它像here :

function checkEmpty() { 
    // filter over the empty inputs 
    return inputs.filter(function() { 
     return !(this.value); 
    }).length === 0; 
} 

Answer 3

将这个模糊函数内，以找出是否所有隐藏的投入有一个非空值。

var empty=false; 
$('input[type=hidden]').each(function(){ 
if($(this).val()==""){ 
empty=true; 
} 
}); 
if(empty){ 
//DISABLE SUBMIT 
} 

Answer 4

当您不应该使用JavaScript变量时，您正在使用$。工作小提琴：http://jsfiddle.net/keliix06/2f3cv2pk/

$(document).ready(function() { 
    var submit = $("input[type=submit]"), 
     inputs = $('input[type=hidden]'); 

    function checkEmpty() { 

     // filter over the empty inputs 

     return inputs.filter(function() { 
      return !$.trim(this.value); 
     }).length === 0; 
    } 

    inputs.on('blur', function() { 
     submit.prop("disabled", !checkEmpty()); 
    }).blur(); // trigger an initial blur 


});