在不使用 jQuery 重新加载页面的情况下将 Flask 输入更新为 HTML [重复]

Posted

技术标签:

【中文标题】在不使用 jQuery 重新加载页面的情况下将 Flask 输入更新为 HTML [重复]【英文标题】:Update a Flask input to HTML without reloading the page using jQuery [duplicate] 【发布时间】:2020-03-28 05:50:30 【问题描述】:

我目前正在输出 总总价格,它是 产品价格劳动力成本 的总和。但是,当用户有一定的折扣时,他应该可以填写,并且应该重新计算总价,仅将折扣应用于产品价格。

<body>
  <p>The total gross price is: <b>€ total_price </b></p>
  <form action=" url_for('sent') " id="formEmail" method="POST">
    <div class="row">
      <div class="column">
        % Discount:
      </div>
      <div class="column">
        <input type="number" name="discount" min="0" value="0">
      </div>
    </div>
    <!---->
    <div class="row">
      <div class="column">
        Email Address*:
      </div>
      <div class="column">
        <input type="email" name="email" required />
      </div>
    </div>
    <input type="submit" value="Send Price Estimate" />
  </form>
</body>

总价由 Flask 函数输入。 但是,当用户输入高于 0% 的折扣时,这应该变为(产品价格(1-折扣)+ 人工成本)。

我可以使用 jQuery 函数来实时更新这个值吗?

【问题讨论】:

是的,您可以使用 JQuery。为什么不 ?没有什么特别要知道的,除了使用 javascript 和您请求 JQuery 时。这是exemple 【参考方案1】:

对于那些可能对答案感兴趣的人:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
    $("div.price").text("€ total_price ");
    $('input[type=number]').on('change', function (e) 
                if ($('input[type=number]').val() > 0) 
                    var new_price = parseFloat( purchase_price *(1 - $('input[type=number]').val()/100) +  work );
                    $("div.price").text("€ "+new_price.toFixed(2));
                 else 
                    $("div.price").text("€  total_price ");
                
            );
</script>

【讨论】:

以上是关于在不使用 jQuery 重新加载页面的情况下将 Flask 输入更新为 HTML [重复]的主要内容,如果未能解决你的问题,请参考以下文章

如何在不重新加载页面的情况下将任意 JSON 发送到 node.js?

如何在不重新加载页面的情况下将服务器端重定向到其他页面并仍将 URL 保留在 Nextjs 应用程序中?

我们如何在不重新加载页面的情况下使用 javascript/jQuery 更新 URL 或查询字符串?

如何在不重新初始化当前帧内容的情况下将一帧的内容加载到另一帧

如何在不使用 .get() 或 .load() 的情况下将 ajax 数据加载到 DIV?

如何使用 JQuery 在不移动页面的情况下将 div 的整个视图替换为另一个 div