2014-10-16 55 views
0

我有一個表單(請參見下面的圖像鏈接),當單擊「否」單選按鈕時需要禁用一組隱藏輸入,並在單擊「是」單選按鈕時啓用它們。有三個不同的類,每個類有四個隱藏的輸入。另外,我需要在Javascript中而不是Jquery中執行此操作,因爲無論出於何種原因,我的Jquery無法正常工作(可能是因爲插件中的多個聲明)。 http://i59.tinypic.com/ofddk.jpg禁用指定類的輸入onClick?

的三類是:

poolHeatingFee,petFee和propertyDamageProtection

...並且每個類都有相應的肯定和附加無單選按鈕點擊設置事件和清除內部HTML顯示價格的divs。 我在想,也許我可以修改這些功能來獲得額外的說法,這將是輸入端的類名和啓用/那是各自的職責範圍內禁用輸入...

  <script type="text/javascript"> 
      function clearFee(theNamedFee){ 
      document.getElementById(theNamedFee).innerHTML = '0.00'; 
      } 

      function showFee(theNamedFee,someFee){ 
      document.getElementById(theNamedFee).innerHTML = someFee; 
      } 
      </script> 

這裏對於無線電代碼...

  <tr class="cart_item"> 
       <td class="product-name"> 

        Preheat Pool?&nbsp;&nbsp;<input type="radio" name="preheatPoolSelect" id="preheatPoolYes" value="yes" onclick='showFee("priceDisplayPoolHeating","8.00")' checked><label for="preheatPoolYes">Yes</label>&nbsp;&nbsp;<input type="radio" name="preheatPoolSelect" id="preheatPoolNo" value="no" onclick='clearFee("priceDisplayPoolHeating")'><label for="preheatPoolNo">No</label> 
       </td> 
       <td class="product-total">       
        $<div id="priceDisplayPoolHeating" class="priceDisplay">8.00</div>       </td> 
      </tr> 

      <tr class="cart_item"> 
       <td class="product-name"> 

        Have Pet(s)?&nbsp;&nbsp;<input type="radio" name="havePetsSelect" id="havePetsYes" value="yes" onclick='showFee("priceDisplayPetFee","7.00")' checked><label for="havePetsYes">Yes</label>&nbsp;&nbsp;<input type="radio" name="havePetsSelect" id="havePetsNo" value="no" onclick='clearFee("priceDisplayPetFee")'><label for="havePetsNo">No</label> 
       </td> 
       <td class="product-total">       
        $<div id="priceDisplayPetFee" class="priceDisplay">7.00</div>       </td> 
      </tr> 

      <tr class="cart_item"> 
       <td class="product-name"> 

        Property Damage Protection?&nbsp;&nbsp;<input type="radio" name="propertyDamageProtectionSelect" id="propertyDamageProtectionYes" value="yes" onclick='showFee("priceDisplayPropertyDamageProtection","4.00")' checked><label for="propertyDamageProtectionYes">Yes</label>&nbsp;&nbsp;<input type="radio" name="propertyDamageProtectionSelect" id="propertyDamageProtectionNo" value="no" onclick='clearFee("priceDisplayPropertyDamageProtection")'><label for="propertyDamageProtectionNo">No</label> 
       </td> 
       <td class="product-total">       
        $<div id="priceDisplayPropertyDamageProtection" class="priceDisplay">4.00</div>       </td> 
      </tr> 

這裏是表單中的HTML ...

  <form id='paypalCheckout' action='https://www.paypal.com/cgi-bin/webscr' method='post' style="margin-bottom: 10px"> 

       <input type="hidden" name="item_name_1" value="Demo Vacation Home" /> 
       <input type="hidden" name="item_number_1" value="Demo-Vacation-Home" /> 
       <input type="hidden" name="amount_1" value="4" /> 
       <input type="hidden" name="quantity_1" value="1" /> 

       <input type="hidden" name="item_name_2" value="Refundable Damage Deposit" /> 
       <input type="hidden" name="item_number_2" value="Refundable-Damage-Deposit" /> 
       <input type="hidden" name="amount_2" value="3" /> 
       <input type="hidden" name="quantity_2" value="1" /> 

       <input type="hidden" name="item_name_3" value="Cleaning Fee" /> 
       <input type="hidden" name="item_number_3" value="Cleaning-Fee" /> 
       <input type="hidden" name="amount_3" value="2" /> 
       <input type="hidden" name="quantity_3" value="1" /> 

       <input type="hidden" name="item_name_4" value="12% Reservation Fee" /> 
       <input type="hidden" name="item_number_4" value="12%-Reservation-Fee" /> 
       <input type="hidden" name="amount_4" value="0.48" /> 
       <input type="hidden" name="quantity_4" value="1" /> 

       <input type="hidden" name="item_name_5" value="8% Tax Rate" /> 
       <input type="hidden" name="item_number_5" value="8%-Tax-Rate" /> 
       <input type="hidden" name="amount_5" value="0.32" /> 
       <input type="hidden" name="quantity_5" value="1" /> 

       <input type="hidden" name="item_name_6" value="Pool-heating Fee" class="poolHeatingFee"/> 
       <input type="hidden" name="item_number_6" value="Pool-heating-Fee" class="poolHeatingFee"/> 
       <input type="hidden" name="amount_6" value="8" class="poolHeatingFee"/> 
       <input type="hidden" name="quantity_6" value="1" class="poolHeatingFee"/> 

       <input type="hidden" name="item_name_7" value="Pet Fee" class="petFee"/> 
       <input type="hidden" name="item_number_7" value="Pet-Fee" class="petFee"/> 
       <input type="hidden" name="amount_7" value="7" class="petFee"/> 
       <input type="hidden" name="quantity_7" value="1" class="petFee"/> 

       <input type="hidden" name="item_name_8" value="Property Damage Protection" class="propertyDamageProtection"/> 
       <input type="hidden" name="item_number_8" value="Property-Damage-Protection" class="propertyDamageProtection"/> 
       <input type="hidden" name="amount_8" value="4" class="propertyDamageProtection"/> 
       <input type="hidden" name="quantity_8" value="1" class="propertyDamageProtection"/> 


       <input type='hidden' name='business' value='[email protected]' /> 
       <input type='hidden' name='shopping_url' value='http://www.dreamhomevacationrentals.com/cart/' /> 
       <input type='hidden' name='lc' value='en_US' /> 
       <input type='hidden' name='cmd' value='_cart' /> 
       <input type='hidden' name='charset' value='utf-8'> 
       <input type='hidden' name='upload' value='1' /> 
       <input type='hidden' name='no_shipping' value='2' /> 
       <input type='hidden' name='currency_code' value='USD' id='currency_code' /> 
       <input type='hidden' name='custom' value='|||' /> 
       <input type='hidden' name='notify_url' value='http://www.dreamhomevacationrentals.com/store/ipn/'> 
       <input type='hidden' name='return' value='http://www.dreamhomevacationrentals.com/thank-you/' /> 
       <input id='PayPalCheckoutButton' type='image' src='https://www.paypal.com/en_US/i/btn/btn_xpressCheckout.gif' value='Checkout With PayPal' /> 

      </form> 

有人可以幫助嗎?

回答

0
   <script type="text/javascript"> 
       function clearFee(theNamedFee,theNamedClass){ 
       document.getElementById(theNamedFee,theNamedClass).innerHTML = '0.00'; 

        var elems = document.getElementsByClassName(theNamedClass); 
        for(var i = 0; i < elems.length; i++) { 
         elems[i].disabled = true; 
        } 
       } 

       function showFee(theNamedFee,someFee,theNamedClass){ 
       document.getElementById(theNamedFee).innerHTML = someFee; 

        var elems = document.getElementsByClassName(theNamedClass); 
        for(var i = 0; i < elems.length; i++) { 
         elems[i].disabled = false; 
        } 

       } 
       </script>