क्लिक पर एक div की jquery परिवर्तन शैली

Question

मेरे पास एक विशिष्ट शैली के साथ एक div है (चलो एक निश्चित पृष्ठभूमि कहें)।

क्या मैं चाहता हूँ, जब एक एक सूची तत्व पर क्लिक करता है एक अलग तत्व में एक अन्य क्षेत्र है कि div से संबंधित हैं कि div एक और विशिष्ट शैली (एक और पृष्ठभूमि प्रकार) है कि div लिए लागू किया जा करने के लिए,

लागू किया हो रही क्लिक किया गया है, शैली बदलना नहीं चाहिए।

क्या यह jquery का उपयोग कर संभव है? धन्यवाद!

संपादित करें: (मेरी समारोह कुछ अन्य बातों को भी करता है लेकिन बदलते रंग नहीं करता है; काम नहीं के रूप में मैं चाहता हूँ यह सभी आइटम मैं क्लिक करें, की पृष्ठभूमि में परिवर्तन न केवल पिछले क्लिक किया।।।)

$(document).ready(function() { 
    $('.product_types > li').click(function() { 
     $(this) 
     .css('backgroundColor','#EE178C') 
     .siblings() 
     .css('backgroundColor','#ffffff'); 

     $('#submit_button').removeAttr('disabled'); 
     $('#number').removeAttr('disabled'); 
    }); 
}); 

Answer 1

जैसा कि मैंने क्या आपके प्रश्न पर समझ में है, यह तुम क्या चाहते है।

यहाँ नीचे की एक jsFiddle है:

$('.childDiv').click(function() { 
 
    $(this).parent().find('.childDiv').css('background-color', '#ffffff'); 
 
    $(this).css('background-color', '#ff0000'); 
 
});

.parentDiv { 
 
    border: 1px solid black; 
 
    padding: 10px; 
 
    width: 80px; 
 
    margin: 5px; 
 
    display: relative; 
 
} 
 
.childDiv { 
 
    border: 1px solid blue; 
 
    height: 50px; 
 
    margin: 10px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
 
<div id="divParent1" class="parentDiv"> 
 
    Group 1 
 
    <div id="child1" class="childDiv"> 
 
    Child 1 
 
    </div> 
 
    <div id="child2" class="childDiv"> 
 
    Child 2 
 
    </div> 
 
</div> 
 
<div id="divParent2" class="parentDiv"> 
 
    Group 2 
 
    <div id="child1" class="childDiv"> 
 
    Child 1 
 
    </div> 
 
    <div id="child2" class="childDiv"> 
 
    Child 2 
 
    </div> 
 
</div>

Answer 2

आप jQuery के .css विधि ..

संदर्भ का उपयोग कर सकते css method

Answer 3

$(document).ready(function() { 
    $('#div_one').bind('click', function() { 
    $('#div_two').addClass('large'); 
    }); 
}); 

अगर मैं आपका प्रश्न समझ गया।

या आप सीएसएस सीधे संशोधित कर सकते हैं:

var $speech = $('div.speech'); 
var currentSize = $speech.css('fontSize'); 
$speech.css('fontSize', '10px'); 

Answer 4

हे दाना, अगर मैं सही ढंग से समझ आप एक उल सूची में किसी आइटम पर क्लिक करके एक तत्व के सीएसएस शैली बदलना चाहते हैं। क्या मैं सही हू?

एचटीएमएल:

<div class="results" style="background-color:Red;"> 
</div> 

<ul class="colors-list"> 
    <li>Red</li> 
    <li>Blue</li> 
    <li>#ffee99</li> 
</ul> 

jQuery

$('.colors-list li').click(function(e){ 
    var color = $(this).text(); 
    $('.results').css('background-color',color); 
}); 

ध्यान दें कि jQuery addClass, removeClass और toggleClass उपयोग कर सकते हैं यदि आप इसके बजाय इनलाइन स्टाइल से कक्षाएं उपयोग करना चाहते हैं। इसका मतलब है आप ऐसा ही कुछ कर सकते हैं कि:

$('.results').addClass('selected'); 

और सीएसएस में 'चुना' स्टाइल परिभाषित करते हैं।

काम कर उदाहरण: http://jsfiddle.net/uuJmP/