Javascript代码隐藏显示价格*数量显示总数

时间:2013-08-03 23:19:39

标签: javascript store show-hide

我的代码存在这个问题我不能让它给我提供我想要的答案。我想为产品选择一个选项,然后选择其中一个价格选项,然后输入数量并按代码交付小计。 问题是,由于我有不同的产品,每个产品有3种不同的价格,我需要我的代码来提供正确的答案。

我现在的代码只是取第一个产品的第一个价格,而我似乎无法使它工作,我觉得我几乎有代码......请帮助我:)

        <div>Product<br />
    <select id="producto1">
    <option >Selecciona</option>
    <option value="00">---ALARMAS---</option>
    <option value="01">EXTREME BLACK</option>
    <option value="02">EXTREME COBRA</option>
    <option value="03">EXTREME GALACTIC</option>
    </select></div>
    <table>
        <tbody>
            <tr class="e01">
                <td class="0"> </td>


                <td class="01"><label>Price</label><br />
                <select id="elias">

                <option value="180">180</option>
                <option value="200">200</option>
                <option value="220">220</option>
                </select></td>
                <td class="02"><label>Price</label><br />
                <select id="elias1">

                <option value="50">50</option>
                <option value="20">20</option>
                <option value="22">22</option>
                </select></td>
                <td class="03"><label>Price</label><br />
                <select id="elias2">

                <option value="80">80</option>
                <option value="100">100</option>
                <option value="120">120</option>
                </select></td>
            </tr>
        </tbody>
    </table>
    <div>
    <label for="CAT_Custom_500436">Quantity</label><br />
    <input type="text" maxlength="255" name="CAT_Custom_500436" id="CAT_Custom_500436" /></div>
    <div><label for="CAT_Custom_500440">Sub-Total</label><br />
    <input type="text" maxlength="255" name="CAT_Custom_500440" id="CAT_Custom_500440" /></div>
    <br />

爪哇___

         (function($) {
    $("document").ready(function() {
    $("td").hide();
    $("#producto1").change(function() {
    $(".e01 td").hide();
    $("td." + $(this).val()).show();
    });
    });
    })(jQuery);

var e = document.getElementById("elias");
var strUser = e.options[e.selectedIndex].value;

var e = document.getElementById("elias1");
var strUser1 = e.options[e.selectedIndex].value;

var e = document.getElementById("elias2"); 
var strUser2 = e.options[e.selectedIndex].value;

$(function () {
$('input').keyup(function (){
var quantity1 = $("#CAT_Custom_500436").val();


var total1 = quantity1 * strUser;
var total1 = quantity1 * strUser1;
var total1 = quantity1 * strUser2;


$("#CAT_Custom_500440").val(total1); 
});
});

(function($) { $("document").ready(function() { $("td").hide(); $("#producto1").change(function() { $(".e01 td").hide(); $("td." + $(this).val()).show(); }); }); })(jQuery); var e = document.getElementById("elias"); var strUser = e.options[e.selectedIndex].value; var e = document.getElementById("elias1"); var strUser1 = e.options[e.selectedIndex].value; var e = document.getElementById("elias2"); var strUser2 = e.options[e.selectedIndex].value; $(function () { $('input').keyup(function (){ var quantity1 = $("#CAT_Custom_500436").val(); var total1 = quantity1 * strUser; var total1 = quantity1 * strUser1; var total1 = quantity1 * strUser2; $("#CAT_Custom_500440").val(total1); }); });

1 个答案:

答案 0 :(得分:0)

您可以尝试这些内容

  $(document).ready(function () {
     // Cache the variables
     var $elias = $('#elias'),
         $elias1 = $('#elias1'),
         $elias2 = $('#elias2'),
         $product = $('#producto1'),
         $error = $('.error'),
         $container = $('.container');
     $("td").hide();
     var productValue;
     $product.change(function () {
         $(".e01 td").hide();
         $("td." + $(this).val()).show();
         // Only show the container when the selections are not first 2
         if (this.value !== 'Selecciona' && this.value !== '00') {
             $error.addClass('hide');
             $container.removeClass('hide');
         } else {
             $error.removeClass('hide');
             $container.addClass('hide');
         }
         productValue = this.value;
     }).change();
     // Bind the change event for Dropdowns
     var $quantity = $('#CAT_Custom_500436'),
         $total = $("#CAT_Custom_500440");

     $elias.add($elias1).add($elias2).change( findTotal);
     $quantity.keyup(findTotal);

     function findTotal() {
         // Get the value
         var quan = $quantity.val();
         var pri = $('.'+ productValue).find('select').val();
         var tot = pri * quan;
         $total.val(tot);

     }
 });

<强> Check Fiddle