编写一个左右加减的输入框里面的值带有百分比符号

以下是一个使用 JavaScript 编写的左右加减输入框，其中包括带有百分比符号的值：

HTML 代码：

<div class="input-group">
  <span class="input-group-btn">
    <button type="button" class="btn btn-default btn-number" disabled="disabled" data-type="minus" data-field="quant[1]">
      <span class="glyphicon glyphicon-minus"></span>
    </button>
  </span>
  <input type="text" name="quant[1]" class="form-control input-number" value="50%" min="0" max="100">
  <span class="input-group-btn">
    <button type="button" class="btn btn-default btn-number" data-type="plus" data-field="quant[1]">
      <span class="glyphicon glyphicon-plus"></span>
    </button>
  </span>
</div>

JavaScript 代码：

$(document).ready(function() {
  // 左右加减输入框
  $('.btn-number').click(function(e){
    e.preventDefault();
    
    fieldName = $(this).attr('data-field');
    type      = $(this).attr('data-type');
    var input = $("input[name='"+fieldName+"']");
    var currentVal = parseInt(input.val());
    var maxVal = parseInt(input.attr('max'));
    var minVal = parseInt(input.attr('min'));
    var step = input.attr('step');
    step = isNaN(step) ? 1 : parseFloat(step);
    
    if (!isNaN(currentVal)) {
      if(type == 'minus') {
        if(currentVal > minVal) {
          input.val(currentVal - step + '%').change();
        } 
        if(parseInt(input.val()) == minVal) {
          $(this).attr('disabled', true);
        }
      } else if(type == 'plus') {
        if(currentVal < maxVal) {
          input.val(currentVal + step + '%').change();
        }
        if(parseInt(input.val()) == maxVal) {
          $(this).attr('disabled', true);
        }
      }
    } else {
      input.val(minVal + '%');
    }
  });
  
  $('.input-number').focusin(function(){
     $(this).data('oldValue', $(this).val());
  });
  
  $('.input-number').change(function() {
    
    fieldName = $(this).attr('name');
    var input = $("input[name='"+fieldName+"']");
    var currentVal = parseInt(input.val());
    var maxVal = parseInt(input.attr('max'));
    var minVal = parseInt(input.attr('min'));
    
    if (!isNaN(currentVal)) {
      if(currentVal > maxVal) {
        input.val(maxVal + '%');
      } else if(currentVal < minVal) {
        input.val(minVal + '%');
      }
    } else {
      input.val(minVal + '%');
    }
  });
  
  $(".input-number").keydown(function (e) {
      // 允许： backspace, delete, tab, escape, enter 和 .
      if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 190]) !== -1 ||
           // 允许: Ctrl+A
          (e.keyCode == 65 && e.ctrlKey === true) ||
           // 允许: home, end, left, right
          (e.keyCode >= 35 && e.keyCode <= 39)) {
               // 仅当需要时才防止默认操作
               return;
      }
      // 确保它是数字和小数点
      if (e.shiftKey || (e.keyCode < 48 || e.keyCode > 57) && (e.keyCode < 96 || e.keyCode > 105) && e.keyCode != 190) {
          e.preventDefault();
      }
  });
});

这段代码使用了 jQuery 库来简化 JavaScript 的编写，并且包括了对输入框的最大值、最小值、步长和精度进行处理的功能。同时，还包括了防止用户输入非法字符的功能。