我需要将2个输入与价格较低的输入进行比较，将其乘以百分比，并将结果插入佣金输入中，只是我对js不太好，标价是用户写的，百分比和销售额来自数据库，所以你必须将标价与销售价格进行比较，价格较低的是应该乘以百分比的价格
<script>
// generamos un evento click y keyup para cada elemento input con la clase .input
var input=document.querySelectorAll(".input");
input.forEach(function(e) {
e.addEventListener("click",multiplica);
e.addEventListener("keyup",multiplica);
});
// funcion que genera la multiplicacion
function multiplica() {
// nos posicionamos en el tr del producto
var tr=this.closest("tr");
var total=1;
// recorremos todos los elementos del tr que tienen la clase .input
var inputs=tr.querySelectorAll(".input");
inputs.forEach(function(e) {
total*=e.value;
});
// mostramos el total con dos decimales
tr.querySelector(".total").value=total.toFixed(2);
// indicamos que calcule el total
calcularTotal(this.closest("table"));
}
// funcion que calcula la suma total de los productos
function calcularTotal(e) {
var total=0;
// obtenemos todos los totales y los sumamos
var totales=e.querySelectorAll(".total");
totales.forEach(function(e) {
total+=parseFloat(e.value);
});
// mostramos la suma total con dos decimales
e.getElementsByClassName("totales")[0].value=total.toFixed(2);
}
</script><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<td>
<div class="form-group col-xs-4">
<input type="number" value="{{$ventas->PORCENTAJE}}" class="input form-control" id="porcentaje"
style="width:120px;height:40px">
</div>
</td>
<td>
<div class="form-group col-xs-4">
<input type="number" class="input form-control" id="preciolista"
style="width:120px;height:40px">
</div>
</td>
<td>
<div class="form-group col-xs-4">
<input type="text" class="total form-control" id="comision"
style="width:60px;height:40px">
</div>
</td>
<td>
<div class="form-group col-xs-4">
<input type="text" value="{{$ventas->IMPORTE}}" class="form-control" name="venta" id="venta"
style="width:120px;height:40px">
</div>
</td>到目前为止，我的脚本允许将百分比乘以标价，并将结果放入佣金字段
您的JavaScript中似乎有很多内容，我不确定有多少内容是相关的(恐怕我一点西班牙语都不懂(。
为了演示如何尽可能简单地实现这一点，我使用了标记的基本知识。
HTML
<label for="porcentaje">Percentage</label>
<input type="number" name="porcentaje" id="porcentaje" class="comision-input" value="10" />
<label for="preciolista">Price List</label>
<input type="text" name="preciolista" id="preciolista" class="comision-input" value="7" />
<label for="venta">Sale</label>
<input type="text" name="venta" id="venta" class="comision-input" value="5" />
<label for="comision">Commission</label>
<input type="text" name="comision" id="comision" readonly value="0" />
<button id="btn-calculate-comision">Calculate</button>
JavaScript
window.addEventListener("DOMContentLoaded", function () {
// Define variables we'll use for accessing our elements
const porcentaje = document.querySelector("#porcentaje");
const preciolista = document.querySelector("#preciolista");
const venta = document.querySelector("#venta");
const comision = document.querySelector("#comision");
const btn = document.querySelector("#btn-calculate-comision");
const comisionInputs = document.querySelectorAll(".comision-input");
// Define the function that will perform the calculation
calculateComision = () => {
// JavaScript has a Math.min() function
// this returns the smallest of the numbers it is supplied
comision.value =
porcentaje.value * Math.min(preciolista.value, venta.value);
};
// Attach event listeners to the elements
// input could be replaced with blur
// blur is triggered when the input loses focus
comisionInputs.forEach((el) => {
el.addEventListener("input", function () {
calculateComision();
});
});
// Alternatively, you could attach event listeners to each element individually
// useful if you need to perform input element specific functionality
// porcentaje.addEventListener("input", function () {
// calculateComision();
// })
// preciolista.addEventListener("input", function () {
// calculateComision();
// });
// venta.addEventListener("input", function (e) {
// calculateComision();
// });
btn.addEventListener("click", function () {
calculateComision();
});
calculateComision();
});
这是一个CodePen，显示了这一点。