javascript - 使用 jquery 更改文本颜色和大小

Question

我正在设置一个联系表单，其中包括简单的数学计算，我尝试更改文本的大小和颜色，即“$ + 总计”，但它不起作用。这是代码。

<div id="form-total"></div>
<script>
    jQuery(document).ready(function ($) {
        var calculate = function () {
            var   total = 0.00;
 
            // Check the chosen option of a select menu
            var val1 = $('.iphorm_1_1').val();
            if (val1 == 'Ebook') {
                total += 150;
            } else if (val1 == 'Print Book') {
                total += 175;
            } else if (val1 == 'Magazine') {
                total += 200;
            } else if (val1 == 'Other') {
                total += 150;
            }
 
            // A second select menu
            var val2 = $('.iphorm_1_2').val();
            if (val2 == 'Non-Fiction') {
                total += 0;
            } else if (val2 == 'Fiction') {
                total += 0;
            } else if (val2 == 'Other') {
                total += 0;
            }
 
               var val3 = $('.iphorm_1_3').val();
            if (val3 == '2') {
                total += 0;
            } else if (val3 == '3') {
                total += 50;
            } else if (val3 == '4') {
                total += 100;
            } else if (val3 == '5') {
                total += 150;
            } else if (val3 ==  '6') {
                total += 200;
		    } else if (val3 == '7') {
                total += 250;
			} else if (val3 == '8') {
                total += 300;
			} else if (val3 == '9') {
                total += 350;
                       } else if (val3 == '10') {
                total += 400;
			
		    }
			
            
 
            // Display the result to the user
            $('#form-total').text('$' + total);
     
               
            // Set the value of the hidden field
            $('input[name=iphorm_1_7]').val('$' + total);
        };
 
        // Calculate on page load
        calculate();
 
        // Recalculate when these select menus are changed
        $('.iphorm_1_1, .iphorm_1_2, .iphorm_1_3').change(calculate);
    });
</script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

以及我想更改文本颜色和大小的部分。

$('#form-total').text('$' + total);

Answer 1

$('#form-total').text('$' + total).css({"color": "green", "font-size": "400px"});