jQuery

Question

के लिए अपने लघु एक्सटेंशन फ़ंक्शन गुड्स पोस्ट करें SO पर C# एक्सटेंशन विषय के समान व्यर्थ में यह बहुत अच्छा होगा अगर हम उपयोगी jQuery फ़ंक्शन एक्सटेंशन का एक संपूर्ण होस्ट खींच सकें।

विचार कृपया ध्यान दें कोड पूर्ण विकसित नहीं अच्छी तरह से ज्ञात प्लग इन या UI विजेट्स

Answer 1

// Allows chainable logging 
// USAGE: $('#someDiv').hide().log('div hidden').addClass('someClass'); 
// Demo : http://jsbin.com/odeke 
jQuery.log = jQuery.fn.log = function (msg) { 
     if (window.console && window.console.log) { 
     console.log("%s: %o", msg, this); 
     } 
     return this; 
}; 

Answer 2

validation प्लग में भयानक है के छोटे स्निपेट है। AJAX का उपयोग कर क्लाइंट पर गतिशील रूप से सामग्री को सत्यापित करने के लिए इसे ASP.NET MVC ऐप में उपयोग किया गया ... उपयोगकर्ताओं इनपुट के आधार पर कस्टम त्रुटि संदेश भी लौटा ... बहुत अच्छा।

Answer 3

http://plugins.jquery.com/ बड़े और छोटे दोनों प्रकार के प्लगइन होस्ट करता है, और यह थ्रेड कभी भी हो सकता है, इससे कहीं अधिक व्यापक और उपयोगी संसाधन होगा।

Answer 4

किसी तत्व की आईडी प्राप्त करने/सेट करने के लिए बस एक शॉर्टकट।

(function($) { 
    $.fn.id = function(newDOMID){ 
     var $this = $(this); 
     if($this.attr('id')){ 
      if(!newDOMID){ 
       $this.id.getID($this); 
      } 
      else { 
       $this.id.setID($this,newDOMID); 
      } 
     } 
     else { 
      alert('The target no longer appears to be a part of the DOM!') 
     } 
    }; 
    $.fn.id.getID = function($this){ 
     return $this.attr('id'); 
    }; 
    $.fn.id.setID = function($this,newDOMID){ 
     $this.attr('id',newDOMID); 
     return this 
    }; 
})(jQuery); 

यह jQuery प्लगइन्स साइट पर जेआईडी है।

Answer 5

आप यह देखने के लिए उपयोग कर सकते हैं कि कोई चयनकर्ता मौजूद है या नहीं।

if($.exists('#mydiv')) { } 

$.exists = function(selector) { 
    return ($(selector).length); 
} 

Answer 6

आह मैं प्रारंभिक सवाल का एक सा दूर कर रहा हूँ, लेकिन अगर कोई है "मिल/सेट एक आईडी" टुकड़ा, तो मैं अद्वितीय आईडी बनाने के लिए कुछ कोड है:

$.increment = function(){ 
    var me = arguments.callee; 
    if (!me.count) me.count = 0; 
    return ++me.count;  
} 

$.domToSelector = function (jq, options){ 
    var selectors = [], i = 0; defaults = {}, opts = $.extend(defaults,options); 
    $(jq).each(function(){ 
     var $node = $(this);  
     if ($node.attr('id')){ 
      selectors[i] = '#'+$(this).attr('id');  
     } 
     else{ 
      var customId = ''+new Date; 
      customId = customId.replace(/ /g, '').replace(/:/g, '').replace(/\+/g, ''); 
      customId = customId+'_'+$.increment(); 
      if (opts.prefix) customId = opts.prefix+customId; 
      $node.attr('id', customId); 
      selectors[i] = '#'+customId;   
     } 
     i++;  
    }); 
    if (selectors.length == 1) selectors = selectors[0];  
    return selectors; 
} 

Answer 7

त्वरित और आसान AJAX:

निम्नलिखित आप

<a href='http://www.google.com/' rel='#myselector' class='ajax' /> 

तरह एंकर करने की अनुमति

जो href यूआरएल पर एक AJAX क्वेरी करते हैं और परिणाम को एंकर के rel विशेषता में चयनकर्ता द्वारा परिभाषित पहले तत्व में इंजेक्ट करते हैं।

// Allow hrefs with the class 'ajax' and a rel attribute set with a selector to load content via ajax into the selected element. 
$('.ajax').unbind('click').click 
(
    function(e) 
    { 
     $($(this).attr('rel')).load($(this).attr("href")); 
     e.preventDefault(); 
    } 
); 

Answer 8

बाहरी लिंक के रूप में पृष्ठ पर संपूर्ण URL की व्याख्या और उन्हें एक नए टैब में खोलने के लिए और विशिष्ट स्टाइल के लिए अनुकूल शीर्षक & वर्ग के लिए निर्धारित करता है।

$("#content [href^='http']:not(a:has('img'))").each(function(){$(this).attr("target", "_blank").addClass("external").attr("title", "External Link to " + $(this).attr("href"))}); 

Answer 9

चयनकर्ताओं का विस्तार, यानी अपने स्वयं के कस्टम चयनकर्ताओं को लिखना। यहां दो के लिए एक नमूना है:

$(document).ready(function(){ 
    $.extend($.expr[':'], { 
     inputEmpty: inputEmpty, 
     inputNotEmpty: inputNotEmpty 
    }); 
}); 

function inputEmpty(el) { 
    return $(el).val() == ""; 
} 

function inputNotEmpty(el) { 
    return $(el).val() != ""; 
}