2012-04-09 16 views
19

मैं चाहता हूं कि part 1 div शैली परिवर्तनों पर क्लिक करें और part 2 फिर से क्लिक पर यह सामान्य पर वापस आ जाता है। मैंने ऐसा करने की कोशिश की लेकिन मैं part 2 परिणामों को प्राप्त करने में विफल रहा।जावास्क्रिप्ट परिवर्तन Div शैली

निम्नलिखित JavaScript कोड

function abc() { 
    document.getElementById("test").style.color="red"; 
} 

परीक्षण div फिर से क्लिक करने के बाद है, रंग वापस आने के रंग यानी काले defaulr को चाहिए ...

+1

पोस्ट आपके घटना अपने यदि वाक्य में बाध्यकारी कोड –

उत्तर

31
function abc() { 
    var color = document.getElementById("test").style.color; 
    if (color === "red") 
     document.getElementById("test").style.color="black"; 
    else 
     document.getElementById("test").style.color="red"; 
} 
+0

, क्यों नहीं 'रंग =" काला "' और 'color =" red "'। आप पहले से ही रंग –

+1

@AbdullahGheith 'रंग' धारण कर रहे हैं वेरिएबल का * नाम * है। मैं इसे 'बॉब' या जो कुछ भी चाहता था उसका नाम दे सकता था। मैंने रंग को 'रंग' में संग्रहीत किया। –

+0

मेरा मतलब है कि लाइन के बाद और बाद में लाइन –

0

आप क्लिक करने से पहले रंग जाँच कर सकते हैं इसे बदलने के लिए।

function abc() { 
    var elem=document.getElementById('test'),color; 
    switch(elem.style.color) { 
     case('red'): 
      color='black'; 
      break; 
     case('black'): 
     default: 
      color='red'; 
    } 
    elem.style.color=color; 
} 
1

function abc() { 
    var currentColor = document.getElementById("test").style.color; 

    if(currentColor == 'red'){ 
    document.getElementById("test").style.color="black"; 
    }else{ 
    document.getElementById("test").style.color="red"; 

    } 
} 
+0

यह सभी ब्राउज़रों के लिए काम नहीं कर सकता –

0

एक साधारण स्विच बयान चाल करना चाहिए रंग की जाँच करें या कुछ ध्वज के लिए कुछ तर्क, लो तत्व (.regular काला है, .alert लाल है):

function abc(){ 
    var myDiv = document.getElementById("test"); 
    if (myDiv.className == 'alert') { 
    myDiv.className = 'regular'; 
    } else { 
    myDiv.className = 'alert'; 
    } 
} 
0
function abc() { 
    var color = document.getElementById("test").style.color; 
    color = (color=="red") ? "black" : "red" ; 
    document.getElementById("test").style.color= color; 
} 
0

बेहतर की श्रेणी बदलने के लिए:

function abc(){ 
    var color = document.getElementById("test").style.color; 
    if(color==''){ 
     //change 
    }else{ 
     //change back 
    } 
} 
2

jQuery का उपयोग करना:

$(document).ready(function(){ 
    $('div').click(function(){ 
     $(this).toggleClass('clicked'); 
    }); 
});​ 

Live example

+0

अच्छा उदाहरण! सरल और शांत! :) –

संबंधित मुद्दे