首页 > 解决方案 > 如何让 div 充当输入

问题描述

我设置了一个复选框,它将显示一个进度条并按百分比显示其当前进度。如何使 div 标签充当输入以将值保存到数据库中

我尝试在 div 上使用它并显示百分比,但是当我使用输入尝试它时,它无法显示百分比

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="progressbar-container">
  <div class="progressbar-bar"></div>
  <div class="progressbar-label"></div>
  <input type="" name="" id="percentage">
$(document).ready(function() {
  // get box count
  var count = 0;
  var checked = 0;

  function countBoxes() {
    count = $("input[type='checkbox']").length;
    console.log(count);
  }

  countBoxes();
  $(":checkbox").click(countBoxes);

  // count checks

  function countChecked() {
    checked = $("input:checked").length;

    var percentage = parseInt(((checked / count) * 100), 10);
    $(".progressbar-bar").progressbar({
      value: percentage
    });
    $(".progressbar-label").text(percentage + "%");
    $('#percentage').text(percentage + "%")
  }

  countChecked();
  $(":checkbox").click(countChecked);

标签: javascriptjqueryhtml

解决方案


您可以使用该contenteditable属性,然后通过innerHTML.


推荐阅读