JQuery post在地址栏中返回查询字符串

时间:2012-09-27 14:54:36

标签: jquery ajax

我正在使用JQuery开发Web表单并通过post发送到PHP页面。

看起来像这样:

$('#form-signup').submit(function(e)
{
    $.ajax(
    {
        type: 'POST',
        data: { name: $('#name').val() },
        url: 'signup_backend.php',
        success: function(data, textStatus, jqXHR)
        {
        },
        error: function(jqXHR, textStatus, errorThrown)
        {
            alert('error');
        }
    });

我的网页表单如下:

<form id="form-signup" action="">
    <fieldset>
        <label for="name">Nome</label>
        <input type="text" id="name" name="name" value="<?=$name?>"><span class="required">*</span>
    </fieldset>
    <fieldset>
        <label for="email">Email</label>
        <input type="email" id="email" name="email" value="<?=$email?>"><span class="required">*</span>
    </fieldset>
    <fieldset>
        <label for="tel">Telefone</label><input type="tel" id="tel" name="tel" value="<?=$tel?>"><span class="required">*</span>
    </fieldset>
    <fieldset>
        <div>
            <label class="blocker">Tipo de anunciante</label><span class="required">*</span>
        </div>
        <input type="radio" name="advertiser" id="advertiser_1">
        <label for="advertiser_1" class="aleft">Particular</label>
        <input type="radio" name="advertiser" id="advertiser_2">
        <label for="advertiser_2" class="aleft">Imobiliária</label>
    </fieldset>
    <fieldset>
        <label for="password">Senha</label>
        <input type="password" id="password" name="password" value="<?=$password?>"><span class="required">*</span>
    </fieldset>
    <fieldset>
        <label for="check-password">Confirmação da senha</label>
        <input type="password" id="check-password" name="check_password" value="<?=$check_password?>"><span class="required">*</span>
    </fieldset>
    <fieldset>
        <input type="submit" value="Enviar" id="sub">
    </fieldset>
</form>

当我收到回复时,我的地址显示:

http://localhost:8888/guia/web/adm/signup.php?name=John&email=&tel=&password=&check_password=

有没有办法从我的地址栏中避免这些数据?

谢谢你们

5 个答案:

答案 0 :(得分:6)

阻止表单提交的默认操作

$('#form-signup').submit(function(e){
    e.preventDefault(); /// <--- THIS LINE
    $.ajax({
        type: 'POST',
        data: {name: $('#name').val()},
        url: 'signup_backend.php',
        success: function(data, textStatus, jqXHR){

        },
        error: function(jqXHR, textStatus, errorThrown){
            alert('error');
        }
    });
});

答案 1 :(得分:2)

您是否尝试在处理程序结束时返回false(对于提交函数)?

答案 2 :(得分:1)

看起来好像你没有阻止submit事件的默认行为(提交表单),所以当你的表单提交时,你得到一个AJAX POST请求和一个正常的GET表单提交

添加:

e.preventDefault();

进入您的submit事件处理函数以阻止默认表单提交,发送AJAX POST请求。

答案 3 :(得分:0)

您可以在method='POST'标记中定义form。这也将决定类型,而不是将其放在jquery函数中。

<form id="form-signup" action="POST">

如下:

<form id="form-signup" action="POST">
    <fieldset>
        <label for="name">Nome</label>
        <input type="text" id="name" name="name" value="<?=$name?>"><span class="required">*</span>
    </fieldset>
    <fieldset>
        <label for="email">Email</label>
        <input type="email" id="email" name="email" value="<?=$email?>"><span class="required">*</span>
    </fieldset>
    <fieldset>
        <label for="tel">Telefone</label><input type="tel" id="tel" name="tel" value="<?=$tel?>"><span class="required">*</span>
    </fieldset>
    <fieldset>
        <div>
            <label class="blocker">Tipo de anunciante</label><span class="required">*</span>
        </div>
        <input type="radio" name="advertiser" id="advertiser_1">
        <label for="advertiser_1" class="aleft">Particular</label>
        <input type="radio" name="advertiser" id="advertiser_2">
        <label for="advertiser_2" class="aleft">Imobiliária</label>
    </fieldset>
    <fieldset>
        <label for="password">Senha</label>
        <input type="password" id="password" name="password" value="<?=$password?>"><span class="required">*</span>
    </fieldset>
    <fieldset>
        <label for="check-password">Confirmação da senha</label>
        <input type="password" id="check-password" name="check_password" value="<?=$check_password?>"><span class="required">*</span>
    </fieldset>
    <fieldset>
        <input type="submit" value="Enviar" id="sub">
    </fieldset>
</form>

答案 4 :(得分:0)

另一种依赖jQuery.ajax([settings])

的方法
$.ajax({
    processData : false
)};

网址:http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings