forms - javascript onload page radio checked - Stack Overflow

admin管理员组

文章数量:1401594

I have a function that enables or disables form elements based on which radio item is checked. It is working ok. However, I wish that one of the radio buttons to be checked at page load with the appropriate form elements already disabled or enabled.

Right now on page load, I have one of the radio buttons checked on the form itself but the javascript will fire when there is a change.

Here is the javascript

<script type="text/javascript">
        function customerChoice() {
            if (document.getElementById('radio1').checked) {
                document.getElementById('pany').disabled = false;
                document.getElementById('onetime').disabled = true;
                document.getElementById('span1').style.color = '#cccccc';
                document.getElementById('span2').style.color = '#000000';
                }
            if (document.getElementById('radio2').checked) {
                document.getElementById('pany').disabled = true;
                document.getElementById('onetime').disabled = false;
                document.getElementById('span1').style.color = '#000000';
                document.getElementById('span2').style.color = '#cccccc';
            }
        }
window.onload = customerChoice();

</script>

And here are the two radio buttons.

<input type="radio" name="type" id="radio1" value="C" onclick="customerChoice()" checked />Current Customer<br />

<input type="radio" name="type" id="radio2" value="O" onclick="customerChoice()" />One Time Customer<br />

Need help figuring out what to change in order to make the javascript fire upon loading. Thank you.

I have a function that enables or disables form elements based on which radio item is checked. It is working ok. However, I wish that one of the radio buttons to be checked at page load with the appropriate form elements already disabled or enabled.

Right now on page load, I have one of the radio buttons checked on the form itself but the javascript will fire when there is a change.

Here is the javascript

<script type="text/javascript">
        function customerChoice() {
            if (document.getElementById('radio1').checked) {
                document.getElementById('pany').disabled = false;
                document.getElementById('onetime').disabled = true;
                document.getElementById('span1').style.color = '#cccccc';
                document.getElementById('span2').style.color = '#000000';
                }
            if (document.getElementById('radio2').checked) {
                document.getElementById('pany').disabled = true;
                document.getElementById('onetime').disabled = false;
                document.getElementById('span1').style.color = '#000000';
                document.getElementById('span2').style.color = '#cccccc';
            }
        }
window.onload = customerChoice();

</script>

And here are the two radio buttons.

<input type="radio" name="type" id="radio1" value="C" onclick="customerChoice()" checked />Current Customer<br />

<input type="radio" name="type" id="radio2" value="O" onclick="customerChoice()" />One Time Customer<br />

Need help figuring out what to change in order to make the javascript fire upon loading. Thank you.

• javascript
• forms

Share Improve this question Follow asked May 6, 2013 at 18:29 TomTom 42722 gold badges1212 silver badges2121 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

Try:

window.onload = customerChoice;

The way you have it runs the function immediately, and sets the onload handler to the result (which is undefined, since the function doesn't return anything), rather than to the function itself. It's not working because it runs before the DOM is loaded.

try putting the customerChoice() function inside an anonymous function:

window.onload = function() {
  customerChoice();  
};

本文标签： formsjavascript onload page radio checkedStack Overflow