jQuery कलंक() और क्लिक करें()

Question

मैं निम्नलिखित jQuery कार्यों है

1) प्रपत्र

$(".content").delegate('.entryButton','click', function() { 
     var form = $(this).closest("form"); 
     var id = form.attr('id'); 
     var text = form.find("textarea").val(); 
     Sijax.request('add_entry', [id, text]); 

     //Prevent the form from being submitted (default HTML) 
     return false; 
    }); 

2 सबमिट) प्रपत्र बड़ा करें और दिखाने के प्रवेश बटन

$("textarea").focus(function() { 
     $(this).css('height', '80px'); 
     var button = $(this).parent().next().children(); 
     button.css('visibility', 'visible'); 
     button.css('height', '20px') 
    }); 

3) पाठ क्षेत्र छोटे बनाता है और बटन छुपाता

$("textarea").blur(function() { 
     $(this).css('height', '30px'); 
     var button = $(this).parent().next().children(); 
     button.css('height', '0px') 
    }); 

यह तब होता है जब मैं एक प्रवेश करने की कोशिश: और क्षेत्र (फोकस घटना) में

• क्लिक करें, क्षेत्र बड़ा बढ़ता प्रविष्टि बटन से पता चलता
• पाठ प्रविष्टि बटन पर
• क्लिक करें दर्ज करें पहले समय: अब कलंक घटना आग जो क्षेत्र फिर से छोटा होता है लेकिन क्लिक करें घटना
• आग नहीं है, तो मैं बटन पर क्लिक करें फिर से प्रपत्र सबमिट करता

मुझे लगता है कि इसका मतलब है धुंध और क्लिक घटना एक-दूसरे के साथ हस्तक्षेप करती है?

आप here समस्या का एक झटका पा सकते हैं। जब आप ध्यान केंद्रित फ़ील्ड के साथ बटन दबाते हैं, तो यह फ़ील्ड को धुंधला करता है लेकिन इसे दर्ज नहीं करता है। जब आप धुंधले क्षेत्र के साथ बटन दबाते हैं तो प्रविष्टि जमा हो जाती है।

कोई विचार?

अग्रिम धन्यवाद!

Answer 1

$('.entryButton').on('click', function (e) { 
    return false; // to prevent default form post 
}); 
$("form").delegate('.entryButton','mousedown', function() { 
    $('textarea').trigger('blur'); 
    var form = $(this).closest("form"); 
    var id = form.attr('id'); 
    var text = form.find("textarea").val(); 
    $("#test").append(text);     

    //Prevent the form from being submitted (default HTML) 
    return false; 
}); 

और पहले की तरह ध्यान और कलंक समारोह रखने के लिए।

thanks. 

Answer 2

ऐसा लगता है कि ऊंचाई बदलना और एक रिफ्लो को मजबूर करना क्लिक ईवेंट को रद्द कर देता है। सबसे आसान समाधान या तो क्लिक करने के बजाय mousedown का उपयोग करने के लिए हैं (यह धुंध से पहले आग लगता है) या setTimeout में सीएसएस परिवर्तन को लपेटें।

Answer 3

आपका मुद्दा यह है कि mouseup पर बटन पर click आग, लेकिन जब आप ऊंचाई बदलने के लिए, कि यह जहां अपने माउस बटन पर नहीं रह गया है जब mouseup होता है के लिए बनाता है। mousedownclick और trigger('blur') पर textarea पर दोनों घटनाओं को करने के लिए mousedown का उपयोग करें।

नोट: आपको अभी भी click ईवेंट की आवश्यकता है ताकि आप डिफ़ॉल्ट फॉर्म सबमिशन फ़ंक्शंस को रद्द करने के लिए return false कर सकें।

fiddle

Answer 4

यहाँ समस्या blur घटना है, जो तेजी से click घटना से काम करती है। यही कारण है कि यह पहले फॉर्म जमा करने के बजाय फ़ील्ड को छोटा बनाता है।

आप केवल click से mousedown को पहली पंक्ति को बदलने की जरूरत:

$(".content").delegate('.entryButton','mousedown', function() { 
// your code 
}); 

या:

$(".content").bind('mousedown', function() { 
// your code 
}); 

Answer 5

मैं अपने आप को उपयोग करने के लिए http://api.jquery.com/unbind/