zoukankan      html  css  js  c++  java
  • each jquery

            <div class="first">
                <span>投保人数:</span>
                <input type="text" id="people_num" placeholder="预计投保人数" value="1">  人
            </div>
            <div class="first" style="height: auto;">
                <span class="span2">投保方案:</span>
                <div class="button_main">
                    
                        
                        <div class="button" data-price="1000.55">方案一</div>
                        
                        <div class="button" data-price="2000">方案二</div>
                        
                        <div class="button" data-price="3000">方案三</div>
                        
                    
                </div>
            </div>
            <div class="bottom_button" id="to_calculate">
                立即计算
            </div>
    

      

    //计算价格
    function calculation_price(){
        var people_num = parseInt($('#people_num').val());
        if(people_num < 0){
            console.log("人数错误");
            return false;
        }
        if (!$('.button_main div').hasClass('button_selected')){
            $('.button_main .button:first').addClass('button_selected');
        }
    
        $('.button').each(function(index){
            var _this = $(this);
            var _select_price = parseFloat(_this.data('price'));
            if(_this.hasClass('button_selected')){
                var _select_price = parseFloat(_this.data('price'));
                var total_fee = _select_price * people_num;
                $('#total_fee').html(total_fee + '元');
            }
        });
    }
    
    // $(document).on('click','#to_calculate',function () {
    //     $('.calculation_result').fadeIn();
    // });
    
    //点击切换方案
    $(document).on('click','.button',function () {
        if($('.button').has('button_selected')){
            $('.button').removeClass('button_selected');
        }
        $(this).addClass('button_selected');
        calculation_price();
    });
    //变换投保人数
    $(document).on('change','#people_num',function(){
        var people_num = $('#people_num').val();
        console.log(people_num);
        if(!(/(^[1-9]d*$)/.test(people_num))){
            alert("投保人数仅可为正整数");
            $('#people_num').val('1');
            return false;
        }
        calculation_price();
    });
    

      

  • 相关阅读:
    转战博客园
    C++虐恋:MBCS安装失败导致的四天误工
    Servlet 3.0 新特性详解 (转载)
    数据库连接池proxool的两种使用方式
    java异常处理中的细节
    InvocationTargetException异常的深入研究-servlet的setAttribute与getAttribute
    如果我是一个全栈极客,那么,下一步该怎么走?
    C++基础与提高 001
    用户及文件权限管理
    命令行操作体验
  • 原文地址:https://www.cnblogs.com/pansidong/p/8277869.html
Copyright © 2011-2022 走看看