jQuery

Question

के साथ इनपुट खाली होने पर सबमिट बटन अक्षम करें मैं सबमिट बटन को अक्षम करने का प्रयास कर रहा हूं जब तक कि उपयोगकर्ता ने फ़ॉर्म में इनपुट फ़ील्ड भर दिए हों।

मुझे THIS धागा मिला जो वास्तव में एक अच्छा जवाब था। फ़ील्ड भरने पर सबमिट बटन को फिर से सक्षम करने में मुझे थोड़ी सी समस्या हो रही है।

क्या कोई इस समारोह को देख सकता है और मुझे यह पता लगाने में मदद कर सकता है कि मैं क्या खो रहा हूं? किसी भी मदद की सराहना की जाएगी: डी धन्यवाद।

Heres a Fiddle भी

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

if ($("input:empty").length > 0) { 
$submit.attr("disabled","disabled"); 
} else { 
$submit.removeAttr("disabled"); 
} 
}); 


<form method="POST" action="<%=request.ServerVariables("SCRIPT_NAME")%>"> 
User Name: <input name="Username" type="text" size="14" maxlength="14" /><br /> 
Password: <input name="last_name" type="password" size="14" maxlength="14"><br /> 
<input type="submit" value="Login" name="Submit" id="loggy"> 
</form> 

Answer 1

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

    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 
}); 

Working sample

कलंक के बजाय आप भी तरह KeyUp उपयोग कर सकते हैं:

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

इसके अलावा आप एक से अधिक घटनाओं को जोड़ सकते हैं:

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

Answer 2

आपके प्रश्न में मुझे कोड नहीं दिखाई देता है जहां आप लगातार इनपुट की स्थिति की जांच करते हैं, मुझे लगता है कि समस्या यह है।

आप ऐसा करने के लिए लाइव ईवेंट का उपयोग कर सकते हैं। उदाहरण के रूप में अपने कोड का उपयोग करना:

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

     function checkSubmitState() 
     { 
      if ($("input:empty").length > 0) { 
      $submit.attr("disabled","disabled"); 
      } else { 
      $submit.removeAttr("disabled"); 
      } 
     } 

     // check the submit state on every change or blur event. 
     $("input").live("change blur", checkSubmitState); 
}); 

Answer 3

हालत चलाने से पहले मूल्य की जाँच करने के KeyUp घटना का उपयोग करें:

$(document).ready(function() { 
    $('input:text, input:password').keyup(function() { 
     if ($(this).val() !== "") { 
      $('input:submit').removeAttr('disabled'); 
     } else { 
      $('input:submit').attr('disabled', 'true'); 
     } 
    }); 
}); 

http://jsfiddle.net/tovic/He4Kv/23/

Answer 4

इन उत्तरों यहाँ से कुछ पुराने हो चुके एक लील रहे हैं क्योंकि मैं एक jQuery स्निपेट की तलाश में था। मैंने उनका परीक्षण किया और वे मुझे लगता है कि बहिष्कार के कारण अब ठीक से काम नहीं कर रहे हैं।

इसलिए मैंने अपना खुद का बना दिया और यहां एक नया कामकाजी तरीका (jQuery> = 3.0) है जो उदाहरण के लिए इनपुट ईवेंट पर सुनता है।

var inp = $('[type=text]'), 
 
    btn = $('[type=button]') 
 
btn.prop('disabled',true) 
 

 
inp.on('input',() => { 
 
    var empty 
 
    inp.map(v => 
 
    !inp.eq(v).val() ? 
 
     empty = true : false 
 
) 
 
    btn.prop('disabled',empty || false) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<form> 
 
\t <input type=text><br> 
 
\t <input type=text><br> 
 
\t <input type=text><br> 
 
\t <input type=button value=Send> 
 
</form>

एक सादे जावास्क्रिप्ट उदाहरण here है।