首页 文章

通过ajax将表单变量从load <div>传递到同一个<div>中？

提问于
浏览 次
-1

我正在尝试从jquery点击加载的表单中传递变量 . 进入同一个div . 我尝试过测试但没有一个可以工作 . 这是我的脚本：

Javascript

//login
function login(){
    $('#prop_form').load('inc/prop_form_login.php');
    $('.axn_btn').hide();
}

$(document).ready(function(){
    $("form").on('click', '#submit', function(e){
       e.preventDefault();
       var jsURL = $(this).serialize()+"&lang=$_GET[lang]";
       submit(jsURL);
    });
});

function submit(jsURL){
    $.ajax({
        url:'login_chk.php',
            type :'POST',
            success: function(data){
                $('#prop_form').html(data);
            }
    });
}

HTML

<div id="prop_form">
<div class="axn_btn">
<a onClick="login()">login</a>
</div>
</div>

login_chk.php

<?
session_start();
error_reporting(E_ALL);
print_r($_POST[data]);exit();//for testing purpose
.
.
.
?>

我希望登录表单数据显示在 #prop_form 中 . 但是页面刷新了 login_chk.php 的返回数据 .

javascript php jquery html ajax

3 回答

  • 1

    编辑这必须做的工作;

    function login(){
    $('#prop_form').load('inc/prop_form_login.php');
    $('.axn_btn').hide();
}

$(document).ready(function(){
    $("form").on('click', '#submit', function(e){
       e.preventDefault();
       var getLang = <?php echo "'" . $_GET['lang'] . "'"?>;
       var jsURL = $(this).serialize()+"&lang=" + getLang;
       submit(jsURL);
    });
});
function submit(jsURL){
    $.ajax({
        url:'login_chk.php',
            type :'POST',
            data: {data: jsURL},
            success: function(data){
                $('#prop_form').html(data);
            }
    });
}

    比如你的 login_chk.php

    <?php 
    // This echo will be showed in you success function as data
    echo $_POST["data"];
?>
    回复于
  • 0

    您在单击时加载表单，但是您将onclick事件绑定到文档就绪的提交按钮 . 表单仍未加载 . 也许你可以尝试在函数login（）中加载登录表单后将下面的代码移动到回调

    Edit : use belows code see if it work.

    //login 
function login(){ 
    $('#prop_form').load('inc/prop_form_login.php', function(){
        $("form").on('click', '#submit', function(e){ 
            e.preventDefault(); 
            var jsURL = $(this).serialize()+"&lang=$_GET[lang]"; 
            submit(jsURL); 
        });
    }); 
    $('.axn_btn').hide(); 
} 

function submit(jsURL){ 
    $.ajax({ 
        url:'login_chk.php', 
        type :'POST', 
        success: function(data){ 
            $('#prop_form').html(data); 
        } 
    }); 
}
    回复于
  • 2

    最后，脚本现在正在运行 . 非常感谢@ khairul.ikhwan和@Hakan Kose . 你们真棒！

    这是脚本：

    //login 
function login(){ 
    $('#prop_form').load('inc/prop_form_login.php', function(){
        $("#login_form").on('click', '#submit', function(e){ 
            e.preventDefault(); 
            var jsURL = $('form').serialize()+"&lang=<?=$_GET[lang]?>"; 
            submit(jsURL); 
        });
    }); 
    $('.axn_btn').hide(); 
} 

function submit(jsURL){
    $.ajax({
        url:'login_chk.php',
            type :'POST',
            data: {data: jsURL},
            success: function(data){
                $('#prop_form').html(data);
            }
    });
}

    我不能在同一篇文章中接受你的两个代码 . 但请知道你们是解决方案的一部分 .

    回复于

相关问题