Javascript$。不总是在单击时更新

Javascript$。不总是在单击时更新,javascript,jquery,ajax,Javascript,Jquery,Ajax,我想知道为什么我的代码在单击按钮时没有更新ajax调用。它仅在我刷新页面后显示。我的代码如下: 以下是完整的jquery/javascript代码: $(文档).ready(函数(){ $(“#保存子按钮”).live('单击',函数()){ $.post('save-sub-main.php',$(“#subminform”).serialize(),函数(数据){ $('#submin_save_message').html(数据); }); $('#submin').hide(); //提

我想知道为什么我的代码在单击按钮时没有更新ajax调用。它仅在我刷新页面后显示。我的代码如下:

以下是完整的jquery/javascript代码: $(文档).ready(函数(){ $(“#保存子按钮”).live('单击',函数()){

$.post('save-sub-main.php',$(“#subminform”).serialize(),函数(数据){
$('#submin_save_message').html(数据);
});
$('#submin').hide();
//提交后加载数据
$.get('getsubmin.php',{mainid:'},
功能(数据){
$('.submin_message').html(数据);
});
});
}); //结束
这是HTML表单部分

<div id="submain">

    <form id="submainform" name="submainform" method="post" action="" enctype="multipart/form-data" >
    <table><input type="hidden" name="MAX_FILE_SIZE" value="1000000" />
    <!--<tr><td width="289" align="right">Jou naam:</td><td><input type="text" name="yourname" id="yourname" style="background-color:lightblue;" /></td></tr>
    <tr><td width="289" align="right">Jou e-posadres:</td><td><input type="text" name="email" id="email" style="background-color:lightblue;"/></td></tr>-->
    <tr><td width="289" align="right">Naam van die geskiedkundige figuur (bv. Jan van Riebeeck):</td><td><input type="text" name="name" id="name" /></td></tr>
    <tr><td width="289" align="right">Foto van die geskiedkundige figuur :</td><td><input id="file_upload" name="file_upload" type="file" /></td></tr>
    <tr><td width="289" align="right"><div id="filname"></div></td><td><input id="filename2" name="image" type="hidden" value=""  /></td></tr>
    <!--<tr><td width="289" align="right">Naam van jou inskrywing :</td><td><input type="text" name="title" id="title" /></td></tr>-->
    <tr><td width="289" align="right">Datum waarop die inskrywing gemaak is (bv. 1652):</td><td><input type="text" name="date" id="date" /></td></tr>
    <tr><td width="289" align="right">Status update (bv. Wat sien ek daar in die verte? Is dit 'n tafel?):</td><td><textarea name="message" id="message"></textarea></td></tr>
    <input type="hidden" name="mainid" value="<?php echo $_GET['id']; ?>" />
    <tr><td></td><td><div id="savesubmainbutton" style="color:blue"><input type="button" value="Save" /></div></td></tr>
    </table>
    </form>

Naam van die Geskiedkundge figuur(Jan van Riebeeck私人有限公司):
Foto van die Geskiedkundge figuur:
gemaak的基准瓦罗普模具检验为(bv.1652):
状态更新(bv.Wat sien ek daar在die verte?是否在tafel?):

请记住,ajax调用是异步的——因此在get执行之前post没有返回数据——请更改代码,如图所示

 $(document).ready(function() { 

// Save SubMain data
    $("#savesubmainbutton").live('click',function(){

       $.post('save-sub-main.php',  $("#submainform").serialize(), function(data) {
          $('#submain_save_message').html(data);
          $('#submain').hide();

        // Load data after submission
            $.get('getsubmain.php', { mainid: "<?php echo $_GET['id'];  ?>" },
            function(data) {
              $('.submain_message').html(data);

            });

        });





    });
$(文档).ready(函数(){
//保存Submin数据
$(“#保存子按钮”).live('单击',函数()){
$.post('save-sub-main.php',$(“#subminform”).serialize(),函数(数据){
$('#submin_save_message').html(数据);
$('#submin').hide();
//提交后加载数据
$.get('getsubmin.php',{mainid:'},
功能(数据){
$('.submin_message').html(数据);
});
});
});

}))//结束

记住您的ajax调用是异步的-因此在执行get之前post没有返回数据-如图所示更改代码

 $(document).ready(function() { 

// Save SubMain data
    $("#savesubmainbutton").live('click',function(){

       $.post('save-sub-main.php',  $("#submainform").serialize(), function(data) {
          $('#submain_save_message').html(data);
          $('#submain').hide();

        // Load data after submission
            $.get('getsubmain.php', { mainid: "<?php echo $_GET['id'];  ?>" },
            function(data) {
              $('.submain_message').html(data);

            });

        });





    });
$(文档).ready(函数(){
//保存Submin数据
$(“#保存子按钮”).live('单击',函数()){
$.post('save-sub-main.php',$(“#subminform”).serialize(),函数(数据){
$('#submin_save_message').html(数据);
$('#submin').hide();
//提交后加载数据
$.get('getsubmin.php',{mainid:'},
功能(数据){
$('.submin_message').html(数据);
});
});
});

}))//end

您的
$。get
未在您的
$的回调上调用。post
。因此,
$.get
正在运行,但由于数据尚未提交,因此不会返回任何新数据

如果将
$.get
移动到回调内部,它将按预期工作

虽然不必麻烦进行第二次ajax调用,而只从
$返回数据会更好、更有效。但是,在
$的返回数据中获取
。post

类似于下面的内容,假设您以json对象的形式返回数据,这样您就可以为响应的两个不同部分使用两个变量

  $.post('save-sub-main.php',  $("#submainform").serialize(), function(data) {
       $('#submain_save_message').html(data.save_message);
       $('#submain').hide();
       $('.submain_message').html(data.return_data);
     },'json');

您的
$.get
没有在您的
$.post
的回调上被调用。因此,
$.get
正在运行,但由于数据尚未提交,因此不会返回任何新数据

如果将
$.get
移动到回调内部,它将按预期工作

虽然不必麻烦进行第二次ajax调用,而只从
$返回数据会更好、更有效。但是,在
$的返回数据中获取
。post

类似于下面的内容,假设您以json对象的形式返回数据,这样您就可以为响应的两个不同部分使用两个变量

  $.post('save-sub-main.php',  $("#submainform").serialize(), function(data) {
       $('#submain_save_message').html(data.save_message);
       $('#submain').hide();
       $('.submain_message').html(data.return_data);
     },'json');

如果Get请求使用相同的参数,则浏览器可以缓存它们,有关详细信息,请参阅


您可以使用POST或添加伪参数,例如ticks或current time,这些参数将不同于强制不缓存GET的参数。

如果GET请求使用相同的参数,则浏览器可以缓存它们,有关详细信息,请参阅


您可以使用POST或添加伪参数,例如ticks或current time,这些参数将不同,以强制GET不被缓存。

一些观察结果。如果要替换默认提交行为,最好确保取消单击事件,否则将发生表单的默认行为


此外,post是异步的,因此您需要确保要执行的任何后续工作都是在回调函数中完成的。

。如果要替换默认提交行为,最好确保取消单击事件,否则将发生表单的默认行为


此外,post是异步的,因此您需要确保您想要执行的任何后续工作都在回调函数中完成。

不要这样做<代码>主ID:“
!!如果不先检查请求参数,就不要使用它们。您可以在此处发布php/html代码吗(按钮)您也可以发布标记吗,将脚本中的各种元素放在某种上下文中会有帮助。mainid:“-不要像这样在JavaScript中放置未经扫描的请求参数。这是一个安全漏洞。@Tomalak所说的非常重要,因为这是XSS攻击网站的经典例子。不要这样做<代码>主ID:“
!!如果不先检查请求参数,就不要使用它们。您可以在此处发布php/html代码吗(按钮)您也可以发布标记吗,将脚本中的各种元素放在某种上下文中会有帮助。mainid:“-不要像这样在JavaScript中放置未经扫描的请求参数。这是一个安全漏洞。@Tomalak所说的非常重要,因为这是XSS攻击网站的经典例子。感谢这一小小的改变。非常感谢你的帮助。非常感谢你的帮助。非常感谢你的帮助。