首页 > 解决方案 > 来自 HTML 输入的 JS 输出总和

问题描述

我有这段代码,我试图让“印象数” element.value 随着用户在预算字段中输入而更新,获得结果的最佳做法是什么?展示次数应为预算*350。

<div class="col">
              <div class="input-group">
                <div class="input-group-prepend">
                  <div class="input-group-text">£</div>
                </div>
                <input id="budget" type="text" class="form-control" name="campaign_budget" placeholder="100" value="<?php if(!empty($campaign_budget)) { echo $campaign_budget; } ?>">
              </div>
              <small class="form-text text-muted">You will recieve <span id="impressions">0</span> with this budget.</small>
            </div>

标签: javascripthtml

解决方案


你可以这样做,我在演示中使用了静态预算值,你可以在这里修改和添加你的 PHP 代码。

const impression = document.getElementById('impressions');
document.getElementById("budget")
  .addEventListener('keyup', (e) => {
    impression.innerHTML = e.currentTarget.value * 350;
  });
<div class="col">
  <div class="input-group">
    <div class="input-group-prepend">
      <div class="input-group-text">£</div>
    </div>
    <input id="budget" type="text" class="form-control" name="campaign_budget" placeholder="100" value="50">
  </div>
  <small class="form-text text-muted">You will recieve <span id="impressions">0</span> with this budget.</small>
</div>


推荐阅读