डिव (संदेश बॉक्स) jQuery

Question

का उपयोग कर रनटाइम पर छिपा नहीं रहा है मेरे पास निम्न के रूप में एक लॉगिन फॉर्म है।

<li class="loginlink"> 
    <a id="showlogin" href="#"> 
     <span style="color: #666666">Login</span> 
    </a> 
    <div class="loginbox" style="display: block;"> 
     <fieldset> 
      <label>User Name : </label> 
      <input id="input" type="text" value="" name="input"> 
     </fieldset> 
     <label> 
      <span style="display: inline-block; ...;"> Password :</span> 
     </label> 
     <input id="password_txt" type="password" style="padding:5px;..;" 
       value="" name="password_txt"> 
     <p> 
      <a class="loginlink" onclick="mojarra.jsfcljs(document.getElementById('headerForm'), 
        {'j_idt60':'j_idt60'},'');return false" style="color: #666666;.." 
        href="#">Forgot Password? 
      </a> 

      <a class="loginlink" onclick="mojarra.jsfcljs(document.getElementById('headerForm'), 
         {'j_idt63':'j_idt63'},'');return false" style="..." 
         href="#">Register 
      </a> 
     </p> 
     <div class="loginbuttons"> 
      <input id="loginBtn" type="submit" value="Login" name="loginBtn"> 
      <input id="cancellogin" type="button" value="Cancel"> 
     </div> 
    </div> 
</li> 

आप showlogin पर क्लिक करते हैं। मैं इसे प्रदर्शित करने के लिए jQuery का उपयोग करें। जैसा

$('#showlogin').click(function(){ 
    var loginBox = $('.loginbox'); 
    loginBox.show(); 
    $('.loginbox fieldset input').focus(); 
    if (!loginBox.is(':hidden')) { 
     validateUser();    
    }   
}); 

$('#cancellogin').click(function(){ 
    $('.loginbox').hide();   
}); 

function validateUser() {  
    $("#loginBtn").click(function(event){ 

     var userName = $("#input").val(); 
     var password = $("#password_txt").val(); 

     if (userName == "") {     
      $.dialog({     
       message: "UserName must be entered", 
       imageIcon: false, 
       type: "error", 
       okButtonID: "ok", 
       okButtonValue: "OK"     
      }); 
      return false;    
     } 
     return true;    
    }); //end of click    
} //end of validateUser() 

अब क्या मैं बटन पर क्लिक करें बॉक्स

अब की तरह दिखाया गया है अगर मैं लॉगिन बटन पर क्लिक करें लगता है क्या हो रहा है, तो संदेश प्रकट होता है

अब अगर मैं ठीक बटन पर क्लिक करता हूं। बॉक्स गायब हो गया।

यहां तक ​​बातें ठीक हैं। अब मान लीजिए कि मैं रद्द करें बटन पर क्लिक करके लॉगिन फॉर्म बंद कर दूं। और फिर प्रपत्र

अब फिर से लॉगिन बटन पर क्लिक करें खोलें। संदेश

लेकिन अब इस बार अगर मैं ठीक बटन पर क्लिक करता हूं, तो ओवरले चला गया लेकिन संदेश नहीं है। क्यूं कर? क्यों इस बार यह गायब नहीं है मैं इस

की तरह कुछ मिल सकता है? क्या मैं गलत हूं? कृपया सहायता कीजिए?

धन्यवाद

Answer 1

मैं इस समस्या अपने validateUser() समारोह से संबंधित है लगता है। जब भी आप लॉगिन बॉक्स दिखाते हैं तो आप देखते हैं कि आप एक नया क्लिक हैंडलर बांधते हैं जिसमें लॉगिन बटन पर संवाद दिखाने के लिए कोड होता है।

function validateUser() {  
    $("#loginBtn").click(function(event){ 
    ... 
    }); 
} 

इसका मतलब है कि दूसरी बार लॉगिन बॉक्स दिखाता है कि संवाद वास्तव में दो बार दिखाया गया है। तीसरी बार संवाद 3 बार दिखाया गया है। आप शायद इसे नहीं देख सकते क्योंकि यह आपके केंद्रित है। यदि आप $.dialog.createUI = function (config) { लाइन के बाद जावास्क्रिप्ट alert() फ़ंक्शन ड्रॉप करते हैं तो आपको दूसरी बार लॉगिन दिखाया जाएगा कि आपको 2 अलर्ट मिलेंगे! इस समस्या के उदाहरण के लिए fiddle देखें।

जब तक आपका कोड के भीतर कुछ और नहीं करता है, तो उपयोगकर्ता फ़ंक्शन को सत्यापित करें, मेरा सुझाव है कि आप इस फ़ंक्शन को छोड़ दें और दस्तावेज़ तैयार होने पर क्लिक हैंडर को बाध्य करें। तो अगर आप कुछ इस तरह के साथ अंत:

$(document).ready(function() { 

    $("#loginBtn").click(function (event) { 

     var userName = $("#input").val(); 
     var password = $("#password_txt").val(); 

     if (userName == "") { 
      $.dialog({ 
       message: "UserName must be entered", 
       imageIcon: false, 
       type: "error", 
       okButtonID: "ok", 
       okButtonValue: "OK" 
      }); 
      return false; 
     } 
     return true; 
    }); 

    $('#showlogin').click(function() { 
     var loginBox = $('.loginbox'); 
     loginBox.show(); 
     $('.loginbox fieldset input').focus(); 
     // code to call validate user removed from here! 
    }); 

    $('#cancellogin').click(function() { 
     $('.loginbox').hide(); 
    }); 
});