선택 옵션에서 이상한 동작이 선택됨

Question

한 페이지에 몇 개의 선택 옵션 상자가 있습니다. 선택한 옵션의 값과 텍스트를 가져 와서 숨겨진 필드에 삽입하려고합니다. 첫 번째 옵션 만 선택하면 처음 페이지를 다시로드 한 후) 작동하지 않지만 페이지를 다시로드 한 후 첫 번째 및 두 번째를 선택하면 작동합니다.

작동하도록하려면 먼저 두 번째 선택 상자에서 옵션을 선택해야합니다. 작동합니다.

여기 링크가 사이트에 있습니다. http://www.snappy-pizza.net/sides.php

어떤 도움을 주시면 감사하겠습니다.

 <form> 
      <input type="hidden" value="MIXED SALAD" /> 
      <select class="select" name="select3" id="select3"> 
      <option value="0">0</option> 
      <option value="1.99">1</option> 
      <option value="1.99">2</option> 
      <option value="1.99">3</option> 
      <option value="1.99">4</option> 
      <option value="1.99">5</option> 
      <option value="1.99">6</option> 
      <option value="1.99">7</option> 
      <option value="1.99">8</option> 
      </select> 
     </form> 

     <form> 
      <input type="hidden" value="Onion Rings" /> 
      <select class="select" name="select" id="select"> 
      <option value="0">0</option> 
      <option value="1.99">1</option> 
      <option value="1.99">2</option> 
      <option value="1.99">3</option> 
      <option value="1.99">4</option> 
      <option value="1.99">5</option> 
      <option value="1.99">6</option> 
      <option value="1.99">7</option> 
      <option value="1.99">8</option> 
      </select> 
     </form> 

    $(function() { 

     $('#my-add-button-sides').click(function() { 
    var qty = []; 
    var price = []; 
    var items_names = []; 
    var final_price = 0; 

    $('.select option:selected').each(function() { 
     var $this = $(this); 
     if (($this.text()) > 0) { 
      qty.push($this.text()); 
      price.push($this.val()); 
      items_names.push($this.parent().prev('input:hidden').val()); 
     } 
     $this.attr('selected',''); 

    }); 

    var total_price = $.map(qty, function (n,i) { 
     return n * price[i]; 
    }); 

    $.each(total_price,function() { 
     final_price += this; 
    }); 

    var qty_items = $.map(qty, function(n,i) { 
     return n +"--"+ items_names[i]; 
    }); 


    var randomNumber = Math.floor((Math.random() * 9000) + 200); 
    $('input[name=my-item-id]').val(randomNumber); 
    $('input[name=my-item-name]').val(qty_items.join('\n')); 
    $('input[name=my-item-price]').val(final_price); 

    }); 
    }); 

Answer 1

코드를 테스트했으며 첫 번째 선택 상자 만 사용하더라도 final_price 결과가 있습니다. 첫 번째 상자 값 1을 선택하고 1.99 응답을 얻습니다. 예를 확인하십시오.

업데이트 PizzaPrice가 정의되지 않았습니다. 오류가 발생했습니다. ready() 함수의 래퍼 인 $ (function() {}에 첫 번째 코드 블록을 넣으십시오. 코드에 PizzaPrice 변수에 대한 액세스 권한이 없습니다.