一个简单的JavaScript问题

Question

The following code resides on a wordpress site. It is a donation landing page where you can select from a dropdown list, a category for your donation. Upon selecting a category a button shows and allows the user to continue with their donation(currently disabled). Works great in Safari, IE and Firefox, nothing. Can anyone provide any help. Thanks in advance. Code to follow.

Dave

    <p class="donate2">Donate Now</p>
    <table cellpadding="0" cellspacing="0" style="padding:0; width:890px; border:0 !important"><tr><td style="padding:0; border:0 !important;"><p>Our Mission is to give hope and a future back to children who are suffering through debilitating and life threatening illness. We are so very fortunate to have a wonderful team of volunteers and a base of generous donors which support these essential programs for children stricken with serious illness.</p>
    <p>Please use the following link to the right to make your payment via our secure checkout. All donations are 100% tax deductible. Payments for events may only be partially tax deductible. The Gambino Medical and Science Foundation is a 501(c) NonProfit, Tax Exempt Organization. (Federal Tax Exempt No. 13-3586460)</p></td>
    <td style="padding:0; border:0 !important">

    <script>
        function click(frm,value,button) {
            alert(value);
            frm.LinkId.value = value;
            if (value != "") {
                alert('Works');
                document.getElementById(button).style.display = "block"; 
            } else {
                alert('Works2');
                document.getElementById(button).style.display = "none"; 
            }
        }
    </script>

    <form style="float:right; margin-bottom: 100px; margin-left: 105px;" name="PrePage" id="Prepage" method ="post" action= "https://Simplecheckout.authorize.net/payment/CatalogPayment.aspx">
    <select size="1" width="100" name="selectbox" id="selectbox" onchange="click(document.PrePage,document.PrePage.selectbox.options[selectedIndex].value,'button');" >
    <option selected value=""></option>
    <option value="4671dbc4-02ca-459d-8a46-c0783d38319e">General Donation</option>
    <option value="2">Dinner</option>
    </select>
    <input type="hidden" name="LinkId" id="LinkId" value="" /><input id="button" style="display:none;" type="image" src ="wp-content/themes/adsimple/i/donate_button.gif" /></form></td></tr></table>

Answer 1

Change the function's name to notClick and it will work.

The reason why your original code works in Chrome, but not in IE and (some versions of) Firefox is that the <select> tag has a click() method in the latter two, but not in Chrome.

Therefore, the click() in <select onchange="click()"> gets interpreted as this.click() , which actually simulates a click on the select box.

In Chrome, such function does not exist, so click() gets interpreted as window.click() , which is the function you defined.

Answer 2

try this:

<select size="1" width="100" name="selectbox" id="selectbox" onchange="click(document.PrePage,document.PrePage.selectbox.options[this.selectedIndex].value,'button');" >
<option selected value=""></option>
<option value="4671dbc4-02ca-459d-8a46-c0783d38319e">General Donation</option>
<option value="2">Dinner</option>
</select>