Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/457.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript JQuery计算器没有';不显示结果_Javascript_Jquery - Fatal编程技术网

Javascript JQuery计算器没有';不显示结果

Javascript JQuery计算器没有';不显示结果,javascript,jquery,Javascript,Jquery,我对这个基于jQuery的计算器有问题。它根本不跑。控制台中没有错误。请帮我修一下 我想要的是,当我单击“计算”按钮时,计算结果将显示在结果栏中 <div class="line14"><span class="line15">&nbsp;</span> <div class="clear"></div> <div class="line16"> <form method="po

我对这个基于jQuery的计算器有问题。它根本不跑。控制台中没有错误。请帮我修一下

我想要的是,当我单击“计算”按钮时,计算结果将显示在结果栏中

<div class="line14"><span class="line15">&nbsp;</span>
    <div class="clear"></div>
    <div class="line16">
        <form method="post" name="test">
            <ul>
                <li> <span class="line16-lft">How many links will you post a day?</span>
                    <div class="line16-rght">
                        <select class="cus hasCustomSelect" id="numlinks" style="width: 77px; position: relative; left: 55px; height: 22px; font-size: 16px;">
                            <option value="5">5</option>
                            <option value="10">10</option>
                            <option selected="selected" value="15">15</option>
                            <option value="25">25</option>
                            <option value="35">35</option>
                        </select>
                        <span class="customSelect cus" style="display: inline-block;"><span class="customSelectInner" style="width: 53px; display: inline-block;">15</span></span></div>
                    <div class="clear"></div>
                </li>
                <div class="clear"></div>
                <li> <span class="line16-lft">Average money earned for each Link?</span>
                    <div class="line16-rght">
                        <select class="cus hasCustomSelect" id="linksum" style="width: 77px; position: relative; left: 55px; height: 22px; font-size: 16px;">
                            <option value="10">$10</option>
                            <option selected="selected" value="20">$20</option>
                            <option value="25">$25</option>
                            <option value="30">$30</option>
                        </select>
                        <span class="customSelect cus" style="display: inline-block;"><span class="customSelectInner" style="width: 53px; display: inline-block;">$20</span></span></div>
                    <div class="clear"></div>
                </li>
                <div class="clear"></div>
                <li> <span class="line16-lft">How many days a week will you work?</span>
                    <div class="line16-rght">
                        <select class="cus hasCustomSelect" id="daysperweek" style="width: 77px; position: relative; left: 55px; height: 22px; font-size: 16px;">
                            <option value="1">1</option>
                            <option value="2">2</option>
                            <option value="3">3</option>
                            <option value="4">4</option>
                            <option selected="selected" value="5">5</option>
                            <option value="6">6</option>
                            <option value="7">7</option>
                        </select>
                        <span class="customSelect cus" style="display: inline-block;"><span class="customSelectInner" style="width: 53px; display: inline-block;">5</span></span></div>
                    <div class="clear"></div>
                </li>
                <div class="clear"></div>
            </ul>
        </form>
    </div>
    <div class="clear"></div>
    <div class="line18">
        <ul>
            <li>Daily Income: <span id="daily_result">$300</span></li>
            <li>Weekly Income: <span id="weekly_result">$1500</span></li>
        </ul>
        <ul>
            <li>Monthly Income: <span id="monthly_result">$6000</span></li>
            <li>Yearly Income: <span id="yearly_result">$78000</span></li>
        </ul>
        <div class="clear"></div>
    </div>
    <span>
                <button class="line17" id="calculate">Calculate</button>
                </span></div>






<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#calculate').click(function () {

            $('#daily_result').innerHTML = "$" + ($('#numlinks').val() * $('#linksum').val());
            $('#weekly_result').innerHTML = "$" + (1 * $('#numlinks').val() * $('#linksum').val() * $('#daysperweek').val());
            $('#monthly_result').innerHTML ="$" + (4 * $('#numlinks').val() * $('#linksum').val() * $('#daysperweek').val());
            $('#yearly_result').innerHTML ="$" + (52 * $('#numlinks').val() * $('#linksum').val() * $('#daysperweek').val());
        });
    });

  • 你每天会发布多少链接? 5. 10 15 25 35 15
  • 每个链接的平均收入? $10 $20 $25 $30 $20
  • 你一周工作几天? 1. 2. 3. 4. 5. 6. 7. 5.
  • 每日收入:300美元
  • 周收入:1500美元
  • 月收入:6 000美元
  • 年收入:78 000美元
算计 $(文档).ready(函数(){ $(“#计算”)。单击(函数(){ $(“#每日结果”).innerHTML=“$”+($(“#numlinks”).val()*$(“#linksum”).val(); $(“#每周结果”).innerHTML=“$”+(1*$(“#numlinks”).val()*$(“#linksum”).val()*$(“#daysperweek”).val(); $(“#每月结果”).innerHTML=“$”+(4*$(“#numlinks”).val()*$(“#linksum”).val()*$(“#daysperweek”).val(); $(“#年度结果”).innerHTML=“$”+(52*$(“#numlinks”).val()*$(“#linksum”).val()*$(“#daysperweek”).val(); }); });
问题在于,您在以下部分混合了jQuery语法和普通Javascript语法:

$('#daily_result').innerHTML = "$" + ($('#numlinks').val() * $('#linksum').val());
$(“#每日结果”)
是一个jQuery对象。如果要访问底层DOM元素及其
innerHTML
属性,应执行以下操作:

$('#daily_result')[0].innerHTML = "$" + ($('#numlinks').val() * $('#linksum').val());
但另一种可能更好的选择是使用jQuery的
html()
方法:

$('#daily_result').html("$" + ($('#numlinks').val() * $('#linksum').val()));