代码之家  ›  专栏  ›  技术社区  ›  ayush

不刷新页面的表单提交

  •  2
  • ayush  · 技术社区  · 14 年前

    有人能给我看一个使用指南吗 jquery显示成功的表单提交 不刷新页面 . 类似的事情发生在Gmail上,当一条消息被传递时,黄色的覆盖层显示你的消息被传递,然后淡出。 我希望根据表单提交的结果显示消息。

    2 回复  |  直到 10 年前
        1
  •  5
  •   jatt    14 年前

    好啊。。。像这样的…但我没试过…所以使用它就像教程一样。您也可以使用JSON

    JS:

    function processForm() { 
            $.ajax( {
                type: 'POST',
                url: form_process.php,
                data: 'user_name=' + encodeURIComponent(document.getElementById('user_name').value),
                success: function(data) {
                    $('#message').html(data);
                }
            } );
    }
    

    HTML:

    <form action="" method="post" onsubmit="processForm();return false;">
    <input type='text' name='user_name' id='user_name' value='' />
    <input type='submit' name='submit' value='submit'/>
    </form>
    <div id='message'></div>
    

    表格\u process.php

    $user_name = $_POST['user_name'];
    if(do something){
         echo "login success";
    else{
         echo "login unsuccessful";
    }
    
        2
  •  0
  •   Jan W    12 年前

    杰特的回答几乎是对的。但不要忘记将url属性设置为'' 希望这样可以节省几分钟的调试时间