Javascript 同时进行提交按钮发布和AJAX调用？

我有一个表单，它将发布到show_aht2.php，但我也希望它能够进行您在下面的代码中看到的AJAX调用。那么，我怎样才能同时做到这两个，这样用户就不会转到另一个呢？我希望用户留在map.php上

提前谢谢

map.php

    <form action="show_aht2.php" method="post">
           <input type="radio" name="date_selected" value="1d" checked="checked"/>1d
           <input type="radio" name="date_selected" value="1w" />1w
           <input type="radio" name="date_selected" value="1m" />1m
           <input type="radio" name="date_selected" value="3m" />3m
           <input type="submit" id="aht_btn" name="get_aht" value="Get AHT" />
    </form>


<script type="text/javascript">
        $(document).ready(function() {
                $('#aht_btn').click(function(){
                    $.ajax({
                    type:"GET",
                    url : "show_aht2.php",
                    data:{ } , // do I need to pass data if im GET ting?
                    dataType: 'json',
                    success : function(data){
                       //doing stuff
                        //get the MIN value from the array
                            var min = data.reduce(function(prev, curr) {
                                return isNaN(+curr['aht_value']) || prev < +curr['aht_value'] ? prev : +curr['aht_value'];
                            }, 1000000);

                        //  alert("min:" + min); //return min for debug

                            //get the MAX value from the array
                            var max = data.reduce(function(prev, curr) {
                              return isNaN(+curr['aht_value']) || prev > +curr['aht_value'] ? prev : +curr['aht_value'];
                            }, -1000000); 

                            //alert("max:" + max); //return max number for debug

                            //function for calculation of background color depending on aht_value               
                            function conv(x){
                                return Math.floor((x - min) / (max - min) * 255);
                            }

                            //function for background color
                            //if NA then show white background, either show from green to red
                            function colorMe(v){
                              return v == 'NA' ? "#FFF" : "rgb(" + conv(v) + "," + (255-conv(v)) + ",0)";
                            }

                        //going through all DIVs only once with this loop
                        for(var i = 0; i < data.length; i++) { // loop over results
                        var divForResult = $('#desk_' + data[i]['station']); // look for div for this object
                        if(divForResult.length) { // if a div was found
                            divForResult.html(data[i]['aht_value']).css("background-color", colorMe(data[i]['aht_value']));
                        //  alert("station " + data[i]['station'] + " <br>aht value" + data[i]['aht_value'] + "<br>timestamp:"+data[i]['ts_generated']);
                        }//end if
                        }//end for  
                    }//end success
                });//end ajax   
              });//end click
            });//end rdy
        </script>

尝试：

$（文档）.ready（函数（）{
$（'aht#u btn'）。单击（函数（事件）{
event.preventDefault（）；
$.ajax({
键入：“获取”，
url:“show_aht2.php”，
data:{}，//如果我收到消息，我需要传递数据吗？
数据类型：“json”，
成功：功能（数据）{
//做事
}//最终成功
})；//结束ajax
})；//结束单击
});//结束

---

使用方法preventDefault:

首先进行ajax调用，然后使用.submit（）提交表单，然后使用ajax回调

<form action="show_aht2.php" method="post" id="formtopost">

<script type="text/javascript">
        $(document).ready(function() {
                $('#aht_btn').click(function(){
                    $.ajax({
                    type:"GET",
                    url : "show_aht2.php",
                    data:{ } , // do I need to pass data if im GET ting?
                    dataType: 'json',
                    success : function(data){
                       //doing stuff
                       //end success
                    },
                    always: function() {
                       //submit form !!!
                       $("#formtopost").submit();
                    }
                });//end ajax   
              });//end click
            });//end rdy
        </script>

$（文档）.ready（函数（）{
$（'#aht_btn'）。单击（函数（）{
$.ajax({
键入：“获取”，
url:“show_aht2.php”，
data:{}，//如果我收到消息，我需要传递数据吗？
数据类型：“json”，
成功：功能（数据）{
//做事
//最终成功
},
始终：函数（）{
//提交表格！！！
$（“#formtopost”）.submit（）；
}
})；//结束ajax
})；//结束单击
});//结束

您可以使用ajax提交表单，而不是同时提交这两个表单

也许是这样的

<script type="text/javascript">
    $(document).ready(function() {
        $('#aht_btn').click(function(){

            // This prevents the form from submitting
            event.preventDefault();

            // Capture form input
            var $form = $(this);
            var serializedData = $form.serialize();

            // Run the ajax post
            $.ajax({
                url : "show_aht2.php",
                type:"POST",
                data: serializedData
                success: function(response) {
                    // Do something
                }
            });

          });//end click
        });//end rdy
</script>

$（文档）.ready（函数（）{
$（'#aht_btn'）。单击（函数（）{
//这将阻止表单提交
event.preventDefault（）；
//捕获表单输入
var$form=$（此）；
var serializedData=$form.serialize（）；
//运行ajax日志
$.ajax({
url:“show_aht2.php”，
类型：“POST”，
数据：序列化数据
成功：功能（响应）{
//做点什么
}
});
})；//结束单击
});//结束

创建按钮

type=“button”

这样它就不会提交表单了。@davidnguen我的show\u aht2.php脚本正在查询多个表，并在map上从中返回值。phpy您不能同时执行正常提交和Ajax操作。选择一个或另一个。你也不能同时做POST和GET。选择一个或另一个。@developerwk好的，不要同时选择。但是他可以用callback发一篇帖子，然后提交表单。@northkildonan，没错，但完全不清楚他想做什么，因为ajax调用的

success

方法中没有任何内容。我们有一个GET，它什么也得不到，但应该期望从只处理POST的PHP页面获得Json。我的目标是什么？我该怎么做？我是将其保留为“提交”还是将其设置为“按钮”？如果将其设置为“提交”，则必须使用“event.preventDefault（）；”将其设置为按钮，则必须使用脚本提交表单。。。我还向表单标签添加了id。因此，您在“success”中添加的代码行必须放在所有函数之前，因为我需要先发布表单，在获得回调之前，您不能先发布，您必须先调用ajax，然后提交表单。在.always（）构造函数中包含这样的东西很好，因为它在控制台中给了我一个错误。。函数（）后应为标识符？

<form action="show_aht2.php" method="post" id="formtopost">

<script type="text/javascript">
        $(document).ready(function() {
                $('#aht_btn').click(function(){
                    $.ajax({
                    type:"GET",
                    url : "show_aht2.php",
                    data:{ } , // do I need to pass data if im GET ting?
                    dataType: 'json',
                    success : function(data){
                       //doing stuff
                       //end success
                    },
                    always: function() {
                       //submit form !!!
                       $("#formtopost").submit();
                    }
                });//end ajax   
              });//end click
            });//end rdy
        </script>

<script type="text/javascript">
    $(document).ready(function() {
        $('#aht_btn').click(function(){

            // This prevents the form from submitting
            event.preventDefault();

            // Capture form input
            var $form = $(this);
            var serializedData = $form.serialize();

            // Run the ajax post
            $.ajax({
                url : "show_aht2.php",
                type:"POST",
                data: serializedData
                success: function(response) {
                    // Do something
                }
            });

          });//end click
        });//end rdy
</script>