Fatal编程技术网

Javascript 函数的右序列

javascript php

Javascript 函数的右序列,javascript,php,Javascript,Php,我尝试在onChange事件上调用多个函数（参见index.php）。这些功能正在运行，但速度非常慢。函数的顺序应该是：getPrice，getTax，getValues，getValues2 当序列被维护时，脚本将正常工作 getPrice = 10.00 getTax = 5.00 __________+ getValues = 15.00 (total price) 函数的顺序现在是getValues，getValues2

我尝试在
onChange
事件上调用多个函数（参见index.php）。这些功能正在运行，但速度非常慢。函数的顺序应该是：
getPrice
，
getTax
，
getValues
，
getValues2

当序列被维护时，脚本将正常工作

getPrice      = 10.00
getTax        = 5.00   
              __________+
getValues     = 15.00 (total price)
函数的顺序现在是
getValues
，
getValues2
，
getPrice
，
getTax
。但这不是正确的顺序。现在我得到：

getPrice      = 10.00
getTax        = 5.00   
              __________+
getValues     = 0.00 (total price)
我需要第二次执行change
getPrice
和
getTax
，以使
getValues
计算正确

我的问题是。有办法解决这个问题吗？如何以高效和正确的方式运行此脚本

我使用以下代码：

index.php

<html>
<label>Quantity</label><br />
<input type="text" class="form-control" name="quantity1" id="quantity1" onChange='getPrice(this.value);getTax(this.value);getValues();getValues2()' placeholder="Quantity">
</html>


数量
职能：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
function getPrice() {

    // getting the selected id in combo
    var selectedItem = jQuery('#product1 option:selected').val();

    // Do an Ajax request to retrieve the product price
jQuery.ajax({
    url: 'get.php',
    method: 'POST',
    data: {'product1': selectedItem, 'quantity1' : jQuery('#quantity1').val()}, 
    success: function(response){
        // and put the price in text field
        jQuery('#price1').val(response);
    },
    error: function (request, status, error) {
        alert(request.responseText);
    },
}); 
}
</script>

<script>
function getTax() {

    // getting the selected id in combo
    var selectedItem = jQuery('#product1 option:selected').val();

    // Do an Ajax request to retrieve the product price
jQuery.ajax({
    url: 'get11.php',
    method: 'POST',
    data: {'product1': selectedItem, }, 
    success: function(response){
        // and put the price in text field
        jQuery('#tax1').val(response);
    },
    error: function (request, status, error) {
        alert(request.responseText);
    },
}); 
}
</script>

<script>
function getValues(){
    var numVal1 = Number(document.getElementById("price1").value);
    var numVal2 = Number(document.getElementById("price2").value);
    var numVal3 = Number(document.getElementById("price3").value);
    var numVal5 = Number(document.getElementById("price4").value);

    var totalValue = numVal1 + numVal2+numVal3+numVal5;
    document.getElementById("total").value = totalValue;
}
</script>

<script>
function getValues2(){
    var numVal1 = Number(document.getElementById("tax1").value);
    var numVal2 = Number(document.getElementById("price1").value);

    var totalValue = numVal1 + numVal2;
    document.getElementById("lastprice").value = totalValue;
}
</script>


函数getPrice（）{
//在combo中获取所选id
var selectedItem=jQuery（'#product1选项：selected'）.val（）；
//执行Ajax请求以检索产品价格
jQuery.ajax({
url:'get.php'，
方法：“POST”，
数据：{'product1'：selectedItem'quantity1'：jQuery（'#quantity1'）.val（），
成功：功能（响应）{
//并在文本字段中输入价格
jQuery（'#price1'）.val（响应）；
},
错误：功能（请求、状态、错误）{
警报（request.responseText）；
},
}); 
}
函数getTax（）{
//在combo中获取所选id
var selectedItem=jQuery（'#product1选项：selected'）.val（）；
//执行Ajax请求以检索产品价格
jQuery.ajax({
url:'get11.php'，
方法：“POST”，
数据：{'product1'：selectedItem，}，
成功：功能（响应）{
//并在文本字段中输入价格
jQuery（'#tax1'）.val（响应）；
},
错误：功能（请求、状态、错误）{
警报（request.responseText）；
},
}); 
}
函数getValues（）{
var numVal1=Number（document.getElementById（“price1”）.value）；
var numVal2=Number（document.getElementById（“price2”）.value）；
var numVal3=Number（document.getElementById（“price3”）.value）；
var numVal5=Number（document.getElementById（“price4”）.value）；
var totalValue=numVal1+numVal2+numVal3+numVal5；
document.getElementById（“total”）.value=totalValue；
}
函数getValues2（）{
var numVal1=Number（document.getElementById（“tax1”）.value）；
var numVal2=Number（document.getElementById（“price1”）.value）；
var totalValue=numVal1+numVal2；
document.getElementById（“lastprice”）.value=totalValue；
}
首先，这是一个软件架构问题。为什么对每个动作都使用特殊请求

没有什么更好的解决方案： 1.制作一个主控制器，根据请求的参数获取和计算数据 2.在显示视图时获取数据，然后在前端使用React（例如（））进行计算 3.正如Jaromanda所说，您可以将请求链接到上一个请求（）的done函数中


函数getPrice（）{
//在combo中获取所选id
var selectedItem=jQuery（'#product1选项：selected'）.val（）；
//执行Ajax请求以检索产品价格
jQuery.ajax({
url:'get.php'，
方法：“POST”，
数据：{'product1'：selectedItem'quantity1'：jQuery（'#quantity1'）.val（），
成功：功能（响应）
{
//并在文本字段中输入价格
jQuery（'#price1'）.val（响应）；
getTax（）；
},
错误：功能（请求、状态、错误）{
警报（request.responseText）；
},
}); 
}
函数getTax（）{
//在combo中获取所选id
var selectedItem=jQuery（'#product1选项：selected'）.val（）；
//执行Ajax请求以检索产品价格
jQuery.ajax({
url:'get11.php'，
方法：“POST”，
数据：{'product1'：selectedItem，}，
成功：功能（响应）{
//并在文本字段中输入价格
jQuery（'#tax1'）.val（响应）；
var numVal1=Number（document.getElementById（“price1”）.value）；
var numVal2=Number（document.getElementById（“price2”）.value）；
var numVal3=Number（document.getElementById（“price3”）.value）；
var numVal5=Number（document.getElementById（“price4”）.value）；
var totalValue=numVal1+numVal2+numVal3+numVal5；
document.getElementById（“total”）.value=totalValue；
var numVal1=Number（document.getElementById（“tax1”）.value）；
var numVal2=Number（document.getElementById（“price1”）.value）；
var totalValue=numVal1+numVal2；
document.getElementById（“lastprice”）.value=totalValue；
},
错误：功能（请求、状态、错误）{
警报（request.responseText）；
},
}); 
}
为什么不定义所有函数（如
var getValues2=function（）{…}
），然后创建一个主函数，在成功接收第一次回调时使用输入数据按顺序调用所有函数？这样，您可以确保所有函数都将按所需顺序调用。将它们链接起来-从上一个函数的“onSuccess”调用相应的（下一个）函数。getPrice和getTax是异步的。。。因此，您需要等待这些ajax调用完成，然后才能获得价格和税收的价值 
<script>
function getPrice() {

    // getting the selected id in combo
    var selectedItem = jQuery('#product1 option:selected').val();

    // Do an Ajax request to retrieve the product price
    jQuery.ajax({
        url: 'get.php',
        method: 'POST',
        data: {'product1': selectedItem, 'quantity1' : jQuery('#quantity1').val()}, 
        success: function(response)
        {
            // and put the price in text field
            jQuery('#price1').val(response);

            getTax();
        },
        error: function (request, status, error) {
            alert(request.responseText);
        },
    }); 
}
</script>

<script>
function getTax() {

    // getting the selected id in combo
    var selectedItem = jQuery('#product1 option:selected').val();

    // Do an Ajax request to retrieve the product price
    jQuery.ajax({
        url: 'get11.php',
        method: 'POST',
        data: {'product1': selectedItem, }, 
        success: function(response){
            // and put the price in text field
            jQuery('#tax1').val(response);

                var numVal1 = Number(document.getElementById("price1").value);
                var numVal2 = Number(document.getElementById("price2").value);
                var numVal3 = Number(document.getElementById("price3").value);
                var numVal5 = Number(document.getElementById("price4").value);

                var totalValue = numVal1 + numVal2+numVal3+numVal5;
                document.getElementById("total").value = totalValue;

                var numVal1 = Number(document.getElementById("tax1").value);
                var numVal2 = Number(document.getElementById("price1").value);

                var totalValue = numVal1 + numVal2;
                document.getElementById("lastprice").value = totalValue;
        },
        error: function (request, status, error) {
            alert(request.responseText);
        },
    }); 
}
</script>