div

Question

के माध्यम से लूपिंग द्वारा बच्चों को गतिशील रूप से कक्षाएं जोड़ें मुझे कक्षा पंक्ति में 'div's' में गतिशील रूप से कक्षा जोड़ने के लिए एक jquery स्क्रिप्ट चाहिए। वर्ग मार्जिन सेट करने के लिए है। यदि वर्ग पंक्ति में दो div है, तो कक्षा को केवल प्रथम में जोड़ें, और यदि तीन 'div's' श्रेणी दो में से तीसरे से बचें।

तो वास्तविक आवश्यकता div की 'पंक्ति' पर गणना करती है और अंतिम को छोड़कर अन्य को विभाजित करती है। यहाँ मेरी एचटीएमएल है: -

<div class="row"> 
        <div class="two-col"> 
         <h3>Header 2/3 Column</h3> 
         <p>Kidney Cancer Canada is a charitable patient-led support organization established to improve the quality of life for patients and their 
         families living with kidney cancer. <a href="#">Kidney Cancer Canada</a> advocates for access to netreatments, provides support and information to patients, 
         funds much-needed research, and works to increase awareness of kidney cancer as a significant health issue. Our goal is to help patients navigate 
         through information about their disease and ensure they have access to new treatment options available to them.</p> 
        </div> 
        <div class="one-col"> 
         <h3>Header 1/3 Column</h3> 
         <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an 
         excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> 
        </div> 
        <div class="clear"></div> 
       </div> 
       <div class="row"> 
        <div class="one-col"> 
         <h3>Header 1/3 Column</h3> 
         <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an 
         excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> 
        </div> 
        <div class="one-col"> 
         <h3>Header 1/3 Column</h3> 
         <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an 
         excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> 
        </div> 
        <div class="one-col"> 
         <h3>Header 1/3 Column</h3> 
         <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an 
         excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> 
        </div> 
        <div class="clear"></div> 
       </div> 

Answer 1

आप वर्ग clear के साथ अपने divs को उस वर्ग लागू नहीं करना चाहते हैं, तो आप इस का उपयोग कर सकते

$('div.row').find('div').addClass('yourclass').not(':last-child,.clear'); 

या

$('div.row').find('div').addClass('yourclass').not(':last-child'); 

Live Sample

Answer 2

यहाँ इस कार्य को करने के लिए स्क्रिप्ट है:

$.each($(".row"),function() { 

     var length = $(this).find('.two-col').length+$(this).find('.one-col').length+$(this).find('.three-col').length; 
      for(i=1;i<length;i++) 
      { 
      $(this).find(":nth-child("+i+")").addClass('margin-right'); 
      } 
    }); 

Answer 3

$("div.row").each(function(){ 

len = $(this).find("div").length ; 
if ($(this).find("div.clear").length > 0){ 
    len = len-1; 
} 
var i=0; 
$(this).find("div").each(function(){ 
if($(this).attr("class") != "clear"){ 
if (i < len-1){ 
    $(this).addClass("margin_class"); 
    } 
} 
i++; 

}); 

});