Question

我绝对是html和javascript的新手。

我有一个应用，用户可以在其中输入商品的新价格。如果新价格是旧价格的+/- 25％，我想将输入字段的背景颜色设为红色。

它们每次都捕获几项商品的价格，因此我有一个表格字段表。我不知道如何将表格的特定行传递给我的javascript脚本，因为行之间的名称不会更改，行也会根据用户而动态变化。

我正在使用带有wtforms的烧瓶。

这是我现在拥有的javascript函数。

<script type=text/javascript>
  $SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type=text/javascript>

var typingTimer;                //timer identifier
var doneTypingInterval = 1500;  //time in ms, 1.5 second for example
var $input = $('#nuevoPrecio');

//on keyup, start the countdown
$input.on('keyup', function () {
  clearTimeout(typingTimer);
  typingTimer = setTimeout(doneTyping, doneTypingInterval);
});

//on keydown, clear the countdown
$input.on('keydown', function () {
  clearTimeout(typingTimer);
});

//user is "finished typing," do something
function doneTyping () {
        $.getJSON($SCRIPT_ROOT + '/_revisarCaptura', {
          unidades: $('th[name="unidades[0]"]').innerHTML(),
          ultimoPrecio: $('th[name="ultimoPrecio[0]"]').innerHTML(),
          nuevoPrecio: $('th[name="nuevoPrecio[0]"]').innerHTML(),
          nuevasUnidades: $('tr[name="holder[0]"]').innerHTML(),
        }, function(data) {
          $("#nuevoPrecio").style.backgroundColor(data.result);
;

}

</script>

这是脚本必须修改的表


{{form.hidden_tag()}}

{% from '/inputs/_formhelpers.html' import render_field %}
{% set i = [0] %}
<font size= "2"  >
<table class= "table table-striped">
  <tr class = "thead-dark">
    <th style = "text-align:center;">Id</th>
    <th style = "text-align:center;">Cotización</th>
    <th style = "text-align:center;">Artículo</th>
    <th style = "text-align:center;">Descripción</th>
    <th style = "text-align:center;">Marca</th>
    <th style = "text-align:center;">Presentación</th>
    <th style = "text-align:center;">Unidades</th>
    <th style = "text-align:center;">Último Precio</th>
    <th style = "text-align:center;">Nuevo Precio (MXN)</th>
    <th style = "text-align:center;">Nuevas Unidades</th>

  </tr>

{% for subForm1, subForm2 in form.precios|zip(form.unidades) %}

    {{ subForm1.hidden_tag() }}
    {{ subForm2.hidden_tag() }}

    <tr>
      <th name = 'version' style = "text-align:center;">{{df.versionId_x[i].values[0]}}</th>
      <th name = 'cotizacion' style = "text-align:center;">{{df.cotizacion[i].values[0]}}</th>
      <th name = 'artciulo' style = "text-align:center;">{{df.nombre[i].values[0]}}</th>
      <th name = 'descripcion' style = "text-align:center;">{{df.descripcion[i].values[0]}}</th>
      <th name = 'marca' style = "text-align:center;">{{df.marca[i].values[0]}}</th>
      <th  name = 'presentacion' style = "text-align:center;">{{df.presentacion[i].values[0]}}</th>
      <th name = 'unidades' style = "text-align:center;">{{df.unidades[i].values[0]}}</th>
      <th name = 'ultimoPrecio' style = "text-align:center;">${{df.ultimoPrecio[i].values[0]}}</th>
      <th name = 'nuevoPrecio' style = "text-align:left">{{render_field(subForm1.precio(style='width:75px;'))}}  <br> <small> <strong> <font color="red">Producto encadenado.</font> </strong> </small> </th>
  <th name = 'nuevasUnidades'style = "text-align:left">{{render_field(subForm2.unidad(style='width:75px'))}} </th>

    </tr>
{% if i.append(i.pop() + 1) %}{% endif %}

{% endfor %}
</table>
</font>

这是验证用户输入是否通过条件的函数：


@inputs.route('/_revisarCaptura')
def revisarCaptura():
    nuevoPrecio = request.args.get('nuevoPrecio',0,type = float)
    nuevasUnidades = request.args.get('nuevasUnidades', 0, type=float)
    ultimoPrecio = request.args.get('ultimoPrecio', 0, type=float)
    unidades = request.args.get('nuevasUnidades', 0, type=float)

    if abs(nuevoPrecio/nuevasUnidades - ultimoPrecio/unidades)/ultimoPrecio/unidades > .25:
        return jsonify(result='red')
    else:
        return jsonify(result='white')

如果满足特定条件，在用户停止输入后如何更改输入字段的背景色

0 个答案: