从DIV自动更新javascript中的值

Question

所以我有这段代码可以在我的网站上很好地工作，我不知道为什么不能在代码段模拟器上工作，但是它的作用是检测页面内产品的价格并计算每月的银行费用因此，用户可以根据我来自的支付网关大致了解价格，事实是，我有根据选择的产品变化而进行价格变化的产品，到目前为止，变量变化precioObtenido但除非我更改了第一个input id=forma，否则html表单不会更新，但是这对用户而言并不直观，我想在div内容<p class="price">更改时自动使表单更新，如何我可以吗？

var precioObtenido;
var tarjetaAlmacenada = "";
var bancoAlmacenado = "";
$(document).ready(function() {
  $('#calculadora').click(function() {
    var preciosf = document.getElementsByClassName('price')[0].textContent;
    var precionc = preciosf.replace(/,/g, '');
    var preciond = precionc.replace('Desde: ', '');
    var preciona = preciond.replace(' (ahorrás 10%)', '')
    var precionum = preciona.replace(/\$/g, '');
    precioObtenido = precionum;
    console.log(precioObtenido);
    //	parent.document.getElementById("abc").reload();
    //	$("#cuotas").load(" #cuotas > *");
    //obtenerCuotas();
    $('#Calculo').toggle(500);
    return false;
  });
});


rateAlmacenado = new Array();

//var rateAlmacenado;

function getParameter(parameter) {
  var url = location.href;
  var index = url.indexOf("?");
  index = url.indexOf(parameter, index) + parameter.length;
  if (url.charAt(index) == "=") {
    var result = url.indexOf("&", index);
    if (result == -1) {
      result = url.length
    };
    return url.substring(index + 1, result);
  }
}

function obtenerSeleccionCombo(idCombo) {
  var indice = document.getElementById(idCombo).selectedIndex;
  var resultado = document.getElementById(idCombo).options[indice].value;
  return resultado;
}

function obtenerClaveCombo(idCombo) {
  var indice = document.getElementById(idCombo).selectedIndex;
  var resultado = document.getElementById(idCombo).options[indice].text;
  return resultado;
}

function limpiarComboBancos() {
  document.getElementById('banco').innerHTML = '<select id="banco" onchange="obtenerCuotas();" style="width: 200px;"></select>';
}

function limpiarComboCuotas() {
  document.getElementById('cuotas').innerHTML = ' <select id="cuotas" onchange="calcular();" style="width: 200px;"></select>';
}

function obtenerFormasPago() {
  var parametros = {};
  $.ajax({
    data: parametros,
    url: 'https://api.mercadopago.com/sites/MLA/payment_methods/',
    type: 'get',
    dataType: "json",
    beforeSend: function() {
      //$("#resultado").html("Procesando, espere por favor...");
    },
    success: function(response) {
      ejecutorObtenerFormasPago(response);
    }
  });
}

function ejecutorObtenerFormasPago(respuesta) {
  var arregloTextos = respuesta;
  var tamanio = arregloTextos.length;
  var i = 0;
  var k = 0;
  var rowTarjetas = document.createElement("tr");
  while (i < tamanio) {
    if (arregloTextos[i].payment_type_id == 'credit_card') {
      var id = arregloTextos[i].id;
      //if(id!='naranja'){
      var tarjeta = arregloTextos[i].name;
      var imagen = arregloTextos[i].thumbnail;
      var cell = createCellWithImagen(imagen);
      rowTarjetas.appendChild(cell);
      document.getElementById("forma").options[k] = new Option(tarjeta, id);
      k++;
      //}
    }
    i++;
  }
  //document.getElementById("tarjetas").appendChild(rowTarjetas);
  seleccionar(tarjetaAlmacenada, 'forma');
  obtenerBancos();
}

function createCellWithImagen(urlImagen) {
  var cell = document.createElement("td");
  var textNode = document.createElement("img");
  textNode.src = urlImagen;
  cell.align = 'center';
  cell.width = '32';
  cell.appendChild(textNode);
  return cell;
}

function obtenerBancos() {
  limpiarComboBancos();
  var id = obtenerSeleccionCombo('forma');
  var parametros = {};
  $.ajax({
    data: parametros,
    url: 'https://api.mercadopago.com/sites/MLA/payment_methods/' + id,
    type: 'get',
    dataType: "json",
    beforeSend: function() {
      //$("#resultado").html("Procesando, espere por favor...");
    },
    success: function(response) {
      ejecutorObtenerBancos(response);
    }
  });
}

function ejecutorObtenerBancos(respuesta) {
  var arregloTextos = respuesta; //JSON.parse(respuesta);
  if (arregloTextos.payment_type_id == 'credit_card') {
    var banco = arregloTextos.card_issuer.name;
    var id = arregloTextos.card_issuer.id;
    if (id == 1 || id == 3 || id == 2 || id == 1007 || id == 5 || id == 288 || id == 692 || id == 688 || id == 4) {
      banco = 'Otros Bancos';
    }

    document.getElementById("banco").options[0] = new Option(banco, id);
    var excepciones = arregloTextos.exceptions_by_card_issuer;

    var tamanio = excepciones.length;
    var i = 0;
    var k = 1;
    while (i < tamanio) {
      var banco = excepciones[i].card_issuer.name;
      var id = excepciones[i].card_issuer.id;
      document.getElementById("banco").options[k] = new Option(banco, id);
      i++;
      k++;
    }
    seleccionar(bancoAlmacenado, 'banco');
    obtenerCuotas();
  } else {
    document.getElementById('selectorBanco').style.display = 'none';
    obtenerCuotasOtros();
  }

}

function obtenerCuotas() {
  limpiarComboCuotas();
  var id = obtenerSeleccionCombo('forma');
  var banco = obtenerSeleccionCombo('banco');
  var parametros = {};
  $.ajax({
    data: parametros,
    url: 'https://api.mercadopago.com/sites/MLA/payment_methods/' + id,
    type: 'get',
    dataType: "json",
    beforeSend: function() {
      //$("#resultado").html("Procesando, espere por favor...");
    },
    success: function(response) {
      ejecutorObtenerCuotas(banco, response);
    }
  });

}

function ejecutorObtenerCuotas(idBanco, respuesta) {
  var arregloTextos = respuesta; //JSON.parse(respuesta);
  var x = 0;
  var bancoObtenido = arregloTextos.card_issuer.id;
  if (bancoObtenido == idBanco) {
    var opcionesPago = arregloTextos.payer_costs;
    var tamanioOpciones = opcionesPago.length;
    var k = 0;
    while (k < tamanioOpciones) {
      var cuotas = opcionesPago[k].installments;
      var rate = opcionesPago[k].installment_rate;
      rateAlmacenado[cuotas] = rate;
      monto = calcular(cuotas);
      if (rate == 0) {
        if (cuotas == 1)
          option = new Option("" + cuotas + " cuota sin interes de $" + monto + "", cuotas);
        else
          option = new Option("" + cuotas + " cuotas sin interes de $" + monto + "", cuotas);

        option.style = "font-weight: bold; color: #32CD32";
        document.getElementById("cuotas").options[x] = option;
      } else {
        document.getElementById("cuotas").options[x] = new Option(cuotas + " cuotas de $" + monto, cuotas);
      }
      x++;
      k++;
    }
  }

  var excepciones = arregloTextos.exceptions_by_card_issuer;
  var tamanio = excepciones.length;
  var i = 0;
  while (i < tamanio) {
    var bancoObtenido = excepciones[i].card_issuer.id;
    if (bancoObtenido == idBanco) {
      var opcionesPago = excepciones[i].payer_costs;
      var tamanioOpciones = opcionesPago.length;
      var k = 0;
      while (k < tamanioOpciones) {
        var cuotas = opcionesPago[k].installments;
        var rate = opcionesPago[k].installment_rate;
        rateAlmacenado[cuotas] = rate;
        monto = calcular(cuotas);
        if (rate == 0) {
          if (cuotas == 1)
            option = new Option("" + cuotas + " cuota sin interes de $" + monto + "", cuotas);
          else
            option = new Option("" + cuotas + " cuotas sin interes de $" + monto + "", cuotas);

          option.style = "font-weight: bold; color: #32CD32";
          document.getElementById("cuotas").options[x] = option;
        } else {
          document.getElementById("cuotas").options[x] = new Option(cuotas + " cuotas de $" + monto, cuotas);
        }
        x++;
        k++;
      }
    }
    i++;
  }
  obtenerPrecioProducto();
}

function obtenerPrecioProducto() {
  precioObtenido = getParameter('id');
  calcular();
  //guardarSeleccion();
}

function ejecutorObtenerPrecioProducto() {
  var arregloTextos = JSON.parse(respuesta3);
  precioObtenido = arregloTextos[0].precio;
  calcular();
}

function calcular(cuotas) {
  //return 1;
  //precioObtenido = <?php echo preciowc();?>;
  var preciosf = document.getElementsByClassName('price')[0].textContent;
  var precionc = preciosf.replace(/,/g, '');
  var preciond = precionc.replace('Desde: ', '');
  var preciona = preciond.replace(' (ahorrás 10%)', '')
  var precionum = preciona.replace(/\$/g, '');
  precioObtenido = precionum;

  //var ind = document.getElementById('cuotas').selectedIndex;
  //var cantCuotas = document.getElementById('cuotas').options[ind].value;
  var cantCuotas = cuotas;
  var rate = rateAlmacenado[cuotas];
  var montoFinal = 0;
  if (rate > 0) {
    montoFinal = parseFloat(precioObtenido) + (parseFloat(rate) * parseFloat(precioObtenido)) / 100;
  } else {
    montoFinal = parseFloat(rate) + parseFloat(precioObtenido);
  }
  //var cantCuotas = obtenerClaveCombo('cuotas');
  var valorCuota = montoFinal / parseInt(cantCuotas);
  //document.getElementById('cuota').innerHTML = '$' + valorCuota.toFixed(2);
  //document.getElementById('montofinal').innerHTML = '$' + montoFinal.toFixed(2);
  return valorCuota.toFixed(2);
}




function obtenerSeleccionPrevia() {
  var url1 = "http://www.rilstore.com.ar/wp-content/themes/lz-fashion-ecommerce/servlet.txt"
  var metodo1 = "GET";
  var esAsincrono1 = "true";
  var unEjecutor1 = "ejecutorObtenerSeleccionPrevia()";
  send7(url1, metodo1, esAsincrono1, unEjecutor1);
}

function ejecutorObtenerSeleccionPrevia() {
  var arregloTextos = JSON.parse(respuesta7);
  tarjetaAlmacenada = arregloTextos[0].tarjeta;
  bancoAlmacenado = arregloTextos[0].banco;
  obtenerFormasPago();
}

function seleccionar(id, combo) {
  var tamanio = document.getElementById(combo).length;
  var i = 0;
  var encontrado = false;
  while (!encontrado && i < tamanio) {
    var valor = document.getElementById(combo).options[i].value;
    if (valor == id) {
      encontrado = true;
      document.getElementById(combo).selectedIndex = i;
    }
    i++;
  }
}

function guardarSeleccion() {
  var idTarjeta = obtenerSeleccionCombo('forma');
  var idBanco = obtenerSeleccionCombo('banco');
  var url1 = "servlets/ServletProductos.php?accion=guardarSeleccion&idTarjeta=" + idTarjeta + "&idBanco=" + idBanco;
  var metodo1 = "GET";
  var esAsincrono1 = "true";
  var unEjecutor1 = "ejecutorGuardarSeleccion()";
  send7(url1, metodo1, esAsincrono1, unEjecutor1);
}

function ejecutorGuardarSeleccion() {}

function obtenerResolucion() {
  if (screen.width < 1400) {
    precioObtenido = getParameter('id');
    location.href = "formaspago1.php?id=" + precioObtenido;
  }
}

function inicializar() {
  //obtenerResolucion();
  obtenerSeleccionPrevia();
}

//$( window ).load(function() {
window.onload = obtenerSeleccionPrevia();
//});

.Calculo {
  display: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.rilstore.com.ar/wp-content/themes/lz-fashion-ecommerce/cuotas.js"></script>

<!--SECTION OF THE PAGE THAT CHANGES DEPENDING ON THE PRODUCTS SELECTED-->
<p class="price"><span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>5,580.00</span> <small class="woocommerce-price-suffix">(ahorrás 10%)</small></p>

<!--FORM THAT NEEDS TO BE UPDATED BASED ON THE PRICE ABOVE-->
<a href="#" class="button alt" id="calculadora" style="width: 50%"><strong><center>CALCULÁ TUS CUOTAS</center></strong></a><br/><br/>
<div id="Calculo" class="Calculo">
  <select name="forma" class="editable" id="forma" style="width: 100%; color: #848484; font-weight: bold; background-color: transparent" onChange="obtenerBancos();"></select><br/><br/>
  <select name="banco" class="editable" id="banco" style="width: 100%; color: #848484; font-weight: bold; background-color: transparent" onChange="obtenerCuotas();"></select><br/><br/>
  <select id="cuotas" class="editable" name="cuotas" style="width: 100%; color: #848484; font-weight: bold; background-color: transparent"></select>
  <p align="right"><small>*Cuotas calculadas por MercadoPago, pueden variar.<br/>**Cuotas por producto, si esta comprando mas de uno, proceda al pago para obtener las cuotas correspondientes al monto total.</small></p><br/></div>