बूटस्ट्रैप के बीटीएन-समूह में मैं बटन को प्री-टॉगल कैसे कर सकता हूं?

Question

मैं रेडियो बटन समूह को कैसे तैनात कर सकता हूं और बटनों में से एक को पूर्व-टॉगल कर सकता हूं?

मेरे पास सप्ताह के मूल्यों के साथ एक रेडियो-बटन समूह है। यह एक:

<div class="btn-group" data-toggle="buttons-radio"> 
    <button class="btn" id="test0">Mon</button> 
    <button class="btn" id="test1">Tue</button> 
    <button class="btn" id="test2">Wed</button> 
    <button class="btn" id="test3">Thu</button> 
    <button class="btn" id="test4">Fri</button> 
    <button class="btn" id="test5">Sat</button> 
    <button class="btn" id="test6">Sun</button> 
</div> 

क्या मैं जरूरत है वर्तमान दिन मूल्य (var currentDay = new Date().getDay() प्रयोग करके) और toggle (सक्रिय करें) समूह में इसी बटन लाने के लिए है।

और मैं अगले कोड (बस परीक्षण प्रयोजनों में) के साथ यह टॉगल करने के लिए कोशिश कर रहा हूँ:

$("#test0").button('toggle') 

यह काम नहीं कर रहा।

Answer 1

आप बूटस्ट्रैप .btn.active वर्ग का लाभ ले सकते हैं और बस बटन आप पहली बार चालू किए जाने की कामना करने के लिए जोड़ सकते हैं और आप बटन अनटॉगल को jQuerys toggleClass उपयोग कर सकते हैं। Demo।

---

बस देखा चहचहाना एक बटन स्क्रिप्ट है कि आप इस प्रभाव के लिए कॉल कर सकते हैं है, यहाँ परिणाम आप उम्मीद कर रहे थे के साथ एक निश्चित demo है।

---

यह देखने के बाद कि आप वास्तव में टिप्पणी से क्या चाहते थे, मैंने परिणामों के साथ अपनी पहेली को अपडेट किया। demo

प्रासंगिक कोड::

मैं एक समारोह है कि एक सरणी से javascripts का उपयोग कर getDay विधि वर्तमान दिन खींचती है और बटन की आईडी लक्ष्यीकरण द्वारा बटन समूह पर इसी दिन टॉगल जोड़ा जे एस

function today() { 
    var arr = ["0", "1", "2", "3", "4", "5", "6"]; //first day of the week is sunday and its index is 0 
    var currentDay = new Date().getDay(); 

    return (arr[currentDay]); 
} 

var day = '[id="test' + today() +'"]'; // we take the current day from the array and add the beginning of the class name and save it in a variable 

$(day).button('toggle'); 

Answer 2

मैं ऊपर की कोशिश की लेकिन केवल एक HTML/CSS समाधान चाहता था।

मैंने पाया एक फोकस आधारित दृष्टिकोण बूटस्ट्रैप 3 के लिए काम करेगा ध्यान दें कि ऑटोफोकस एक एचटीएमएल 5 विशेषता है।

<div class="btn-group"> 
     <button class="btn" id="test0" autofocus="true">Mon</button> 
     <button class="btn" id="test1">Tue</button> 
     <button class="btn" id="test2">Wed</button> 
     <button class="btn" id="test3">Thu</button> 
     <button class="btn" id="test4">Fri</button> 
     <button class="btn" id="test5">Sat</button> 
     <button class="btn" id="test6">Sun</button> 
</div> 

मुझे लगता है Bootply बूटस्ट्रैप साथ fiddles लिए आसान है। http://www.bootply.com/cSntVlPZtU

Answer 3

मैं एक ही समस्या का सामना करना पड़ा, लेकिन एक सरल समाधान चाहता था:
यहाँ अपने परीक्षण bootply है। मैंने देखा है कि कक्षा में "सक्रिय" संलग्न करने से समस्या हल नहीं होती है, क्योंकि इसे किसी भी तरह से हटाया जाता है (मैंने शोध नहीं किया है कि यह ऐसा क्यों करता है)।

समाधान कक्षा में "सक्रिय सक्रिय" संलग्न कर रहा है। इस तरह, केवल एक को हटा दिया जाता है और दूसरा जादू के पीछे हो रहा है। यह वास्तव में गंदा समाधान है, लेकिन यह समस्या हल करता है। आशा करता हूँ की ये काम करेगा!

Answer 4

बस पृष्ठ लोड पर बटन से किया जा रहा क्लिक रूप धारण करना:।

$ ("# buttonid") ट्रिगर ("पर क्लिक करें");

मेरे लिए एक और समान मानक बटन के लिए काम किया, जिसे मैं पेज लोड पर क्लिक करने के रूप में दिखाना चाहता था - पृष्ठ डिफ़ॉल्ट तालिका दृश्य को सेट करने के लिए बटन एक्शन की आवश्यकता थी जिसे मैं प्रदर्शित करना चाहता था। अन्य बटन अलग-अलग विचार प्रदान करते हैं लेकिन डिफ़ॉल्ट एक ने सभी डेटा दिखाए।