2008-12-12 8 views
43

का उपयोग कर रेडियोधर्टन सूची पर क्लिक करना कॉल करना मैं जावास्क्रिप्ट का उपयोग करके रेडियोधर्टन सूची पर क्लिक कैसे करूं?जावास्क्रिप्ट

उत्तर

33

आप रेडियो बटन सूची कैसे बना रहे हैं? आप बस HTML उपयोग कर रहे हैं: आप ASP.NET की तरह कुछ के माध्यम से इन पैदा कर रहे हैं

<input type="radio" onclick="alert('hello');"/> 

, आप सूची में प्रत्येक तत्व के लिए एक विशेषता के रूप में है कि जोड़ सकते हैं। आप इस चलाने आप अपनी सूची में के बाद कर सकते हैं, या यह इनलाइन यदि आप अपनी सूची का निर्माण एक-एक करके:

foreach(ListItem RadioButton in RadioButtons){ 
    RadioButton.Attributes.Add("onclick", "alert('hello');"); 
} 

और जानकारी: http://www.w3schools.com/jsref/event_onclick.asp

+0

आप foreach मतलब (RadioButtons.Items में ListItem RadioButton) नहीं है? – Fandango68

15

मैं @annakata साथ सहमत हैं कि इस सवाल का कुछ की जरूरत है और स्पष्टीकरण है, लेकिन यहां रेडियो बटन के लिए कैसे सेटअप करने के लिए एक onclick ईवेंट हैंडलर का एक बहुत, बहुत बुनियादी उदाहरण है:

<html> 
<head> 
    <script type="text/javascript"> 
    window.onload = function() { 

     var ex1 = document.getElementById('example1'); 
     var ex2 = document.getElementById('example2'); 
     var ex3 = document.getElementById('example3'); 

     ex1.onclick = handler; 
     ex2.onclick = handler; 
     ex3.onclick = handler; 

    } 

    function handler() { 
     alert('clicked'); 
    } 
    </script> 
</head> 
<body> 
    <input type="radio" name="example1" id="example1" value="Example 1" /> 
    <label for="example1">Example 1</label> 
    <input type="radio" name="example2" id="example2" value="Example 2" /> 
    <label for="example1">Example 2</label> 
    <input type="radio" name="example3" id="example3" value="Example 3" /> 
    <label for="example1">Example 3</label> 
</body> 
</html> 
7

समस्या यहां है कि एक RadioButtonList का प्रतिपादन व्यक्तिगत रेडियो बटन लपेटता है (ListItems) अवधि टैग और ई में जब आप क्लाइंट-साइड इवेंट हैंडलर को सूची आइटम पर सीधे गुणों का उपयोग करके असाइन करते हैं तो यह ईवेंट को अवधि में असाइन करता है। इस कार्यक्रम को रेडियोबटन सूची में असाइन करने से इसे उस तालिका में असाइन किया जाता है जो इसे प्रस्तुत करता है।

यहां की चाल सूची सूची को एएसपीएक्स पेज पर जोड़ना है, न कि पीछे कोड से। फिर आप जावास्क्रिप्ट फ़ंक्शन को ऑनक्लिक प्रॉपर्टी पर असाइन कर सकते हैं। यह ब्लॉग पोस्ट; attaching client-side event handler to radio button list by Juri Strumpflohner यह सब बताता है।

यह केवल तभी काम करता है जब आप सूची में पहले से ही जानते हैं और यह मदद नहीं करता है कि रेडियोबटन सूची में आइटम को पीछे कोड का उपयोग करके गतिशील रूप से जोड़ा जाना चाहिए।

+1

चीजों को और खराब करने के लिए, ऑनक्लिक इंटेलिसेंस में भी नहीं आया है। धन्यवाद, इससे मदद मिली। – Narayana

21

एक रेडियो बटन पर onClick ईवेंट को गति प्रदान करने के लिए DOM तत्व की click() विधि आह्वान:

$("#radioButton").click() 

AngularJS:

angular.element('#radioButton').trigger('click') 
+1

हालांकि .click(): के साथ एक बात है यदि आप इस तरह के जावास्क्रिप्ट के साथ किसी रेडियो का चयनित मान बदलते हैं, तो 'परिवर्तन' ईवेंट आईई में आग नहीं लगाता है (मैंने IE8 की कोशिश की) – Michiel

+0

@Michiel बहुत बहुत धन्यवाद, उस टिप्पणी ने मेरे लिए एक बहुत ही मुश्किल समस्या हल की! इसके बारे में एक प्रश्न/उत्तर पोस्ट किया - http://stackoverflow.com/a/13827249/66372 ps। क्रोम में व्यवहार भी मौजूद है – eglasius

0

कोशिश

document.getElementById("radioButton").click() 

jQuery का उपयोग कर निम्नलिखित समाधान

HTML:

<div id="variant"> 
<label><input type="radio" name="toggle" class="radio" value="19,99€"><span>A</span></label> 
<label><input type="radio" name="toggle" class="radio" value="<<<"><span>B</span></label> 
<label><input type="radio" name="toggle" class="radio" value="xxx"><span>C</span></label> 
<p id="price"></p> 


जे एस:

$(document).ready(function() { 
     $('.radio').click(function() { 
      document.getElementById('price').innerHTML = $(this).val(); 
     }); 

    });