Jquery 当两个输入都已填充时更改图像

我有两个输入和一个图像。。。当两个输入都已填充时，是否可以更改图像

HTML:

JS:

jsiddle:

是的，试试这种方法

首先使用keyup事件立即捕获输入的更改，然后检查两者是否都有值，并显示/隐藏右按钮：

$('input').on('keyup',function(){
    var complete = true;
    $allInputs.each(function(){
       if($(this).val() === "") complete = false;
   });

   if(complete){
       $button.hide();
       $button2.show();
   } else {
       $button.show();
       $button2.hide();
   }
});

请参见此处的示例：

---

或者使用纯javascript，如果您愿意：

var allInputs = document.getElementsByTagName("input"),
    button1 = document.getElementById('input-blue-img'),
    button2 = document.getElementById('input-green-img');

for(i=0; i<allInputs.length; i++) {
    allInputs[i].onkeyup=function(){
    var completed = true;
    for(y=0; y<allInputs.length; y++) {
        if(allInputs[y].value.length === 0) completed = false;
    }
    if(completed){
        button1.style.display = 'none';
      button2.style.display = 'block';
    } else {
        button1.style.display = 'block';
      button2.style.display = 'none';
    }
  };
}

var allInputs=document.getElementsByTagName（“输入”），
button1=document.getElementById（'input-blue-img'），
button2=document.getElementById（'input-green-img'）；
对于（i=0；i
是，您可以这样做，只需检查两个输入是否为空n keyup event并相应更改图像的src即可。请检查我是否可以再问一个问题？如果我不能使用jQuery-only JS，我如何更改此脚本？当然可以，Annie，您需要什么..如果可能；）是@AnniethCross，我更新了答案。。退房；）谢谢：）-真糟糕，我不能再给你+1；）
var $allInputs = $("input:text"),
$button = $("#input-blue-img");
$button2 = $("#input-green-img");
$allInputs.change(function() {
    var isEmpty = $allInputs.filter(function() {
        return ($(this).val()=="");
    });
    $button.hide();
    $button2.show();
    if(isEmpty.length == 0) {
        $button.show();
    }
});

$('input').on('keyup',function(){
    var complete = true;
    $allInputs.each(function(){
       if($(this).val() === "") complete = false;
   });

   if(complete){
       $button.hide();
       $button2.show();
   } else {
       $button.show();
       $button2.hide();
   }
});

var allInputs = document.getElementsByTagName("input"),
    button1 = document.getElementById('input-blue-img'),
    button2 = document.getElementById('input-green-img');

for(i=0; i<allInputs.length; i++) {
    allInputs[i].onkeyup=function(){
    var completed = true;
    for(y=0; y<allInputs.length; y++) {
        if(allInputs[y].value.length === 0) completed = false;
    }
    if(completed){
        button1.style.display = 'none';
      button2.style.display = 'block';
    } else {
        button1.style.display = 'block';
      button2.style.display = 'none';
    }
  };
}