dqsp60748 2017-12-27 16:47
浏览 88
已采纳

如何刷新同一页面中的特定DIV

I am currently working on this project , which is required for the user to input financial values to calculate the total , I have been able to make an html form , and then php program to calculate and output the total.

Now the thing i want to know is how can i make the the div with id - total to refresh each time the refresh button for that function is clicked , without refreshing the whole page , so that if the user changes a number , the total shows always the correct value. that is , i want the div --> total to update upon click while other entered details are kept intact

Here is my code:

<form method="post" action="calc.php" autocomplete="on">

  Data : <input type="date" name="data" data-date-inline-picker="false" data-date-open-on-focus="true" placeholder="la tua risposta" /><br />
  Ricevuta(€) : <input type="number" name="ricevuta" placeholder="la tua risposta" step="any" /><br />
  * : <input type="number" name="a" placeholder="la tua risposta" step="any" /><br />
  BM(€) : <input type=number name="bm"  placeholder="la tua risposta" step="any" /><br />
  Ass/Bon(€) : <input type="number" name="ass_bon" placeholder="la tua risposta" step="any" /><br />
  Cont(€) : <input type="number" name="cont" placeholder="la tua risposta" step="any" /><br />

<div id="total">
  Total(€) :
  <?php
  $data = $_POST["data"];
  $ricevuta = $_POST["ricevuta"];
  $a = $_POST["a"];
  $bm = $_POST["bm"];
  $ass_bon =  $_POST["ass_bon"];
  $cont = $_POST["cont"];
  $total=$_POST["total"];
  $total = $_POST["bm"] + $_POST["ass_bon"] + $_POST["cont"];
  echo $total;
  ?>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("#total").load("calc.php");
    });
});
</script>
<button>refresh</button>
<br>

  Note : <textarea  name="note" placeholder=" "></textarea><br />

  <input type="submit" value="Invia" />
  </form>
  • 写回答

1条回答 默认 最新

  • duankuan5319 2017-12-27 16:57
    关注

    Try a JS calculation on jsFiddle

    <html>
<head></head>
<body>
    <form autocomplete="on">
      Data : <input type="date" name="data" data-date-inline-picker="false" data-date-open-on-focus="true" placeholder="la tua risposta"><br />
      Ricevuta(€) : <input type="number" name="ricevuta" placeholder="la tua risposta" step="any"><br />
      * : <input type="number" name="a" placeholder="la tua risposta" step="any"><br />
      BM(€) : <input type="number" id="bm" name="bm"  placeholder="la tua risposta" step="any"><br />
      Ass/Bon(€) : <input type="number" id="ass_bon" name="ass_bon" placeholder="la tua risposta" step="any"><br />
      Cont(€) : <input type="number" id="cont" name="cont" placeholder="la tua risposta" step="any"><br />

        <button id="calc" type="button">Calculate</button>
    </form>
    <p id="total"></p>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
        $("#calc").on('click', function(){
            var bm = Number($('#bm').val());
            var ass_bon = Number($('#ass_bon').val());
            var cont = Number($('#cont').val());

            var total = bm + ass_bon + cont;

            $('#total').text(total);
        });
    });
    </script>
</body>
</html>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

悬赏问题

  • ¥15 关于#python#的问题：求帮写python代码
  • ¥15 LiBeAs的带隙等于0.997eV,计算阴离子的N和P
  • ¥15 关于#windows#的问题：怎么用WIN 11系统的电脑 克隆WIN NT3.51-4.0系统的硬盘
  • ¥15 来真人，不要ai！matlab有关常微分方程的问题求解决，
  • ¥15 perl MISA分析p3_in脚本出错
  • ¥15 k8s部署jupyterlab，jupyterlab保存不了文件
  • ¥15 ubuntu虚拟机打包apk错误
  • ¥199 rust编程架构设计的方案 有偿
  • ¥15 回答4f系统的像差计算
  • ¥15 java如何提取出pdf里的文字？