使用 Jquery 更改 css 的问题

Question

I am trying to make 2 step checkout modal

My first step modal is inside div with id ="step1" and with style display block

and step2 with id="step2" with style display none

My buttons inside my modal footer:

<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" onclick="check_address();" id="next_button">Next >></button>
<button type="button" class="btn btn-primary" onclick="back_address();" id="back_button" style="display:none;">Back <<</button>

<button type="submit" class="btn btn-primary" id="checkout_button" style="display:none;">Check Out >></button>

Inside my cart.php file I have an function check_address that corresponds to parser file and ajax that looks like this:

function check_address() {
    var data = {
        'full_name': jQuery('#full_name').val(),
        'email': jQuery('#email').val(),
        'street': jQuery('#street').val(),
        'street2': jQuery('#street2').val(),
        'city': jQuery('#city').val(),
        'state': jQuery('#state').val(),
        'zip_code': jQuery('#zip_code').val(),
        'country': jQuery('#country').val(),

    };
    jQuery.ajax({
        url: '/E-Shop/admin/parsers/check_address.php',
        method: 'POST',
        data: data,
        success: function(data) { //this data is what is forwarded back from the parser file
            if (data != 'passed') {
                jQuery('#payment-errors').html(data);
            }
            if (data == 'passed') {
                jQuery('#payment-errors').html("");
                jQuery('#step1').css("display", "none");
                jQuery('#step2').css("display", "block");
                jQuery('#next_button').css("display", "none");
                jQuery('#back_button').css("display", "inline-block");
                jQuery('#checkout_button').css("display", "inline-block");

            }
        },
        error: function() {
            alert("An error occured!");
        },
    });
}

After I submit my first step form, I get output from check_adress.php parser : "passed" from my last line in check_address.php

if(!empty($greske)){
    echo display_greske($greske);
}else{
    echo 'passed';
}

my check_address.php script: https://pastebin.com/1qA5Tx08

but the jQuery doesn't show or change my css display attributes

Answer 1

删除check_address.php脚本开头<?php之前的空行。

Answer 2

jQuery.ajax({
    url :url,
    type : 'post',
    data : data,
    success : function (data) {
    //    location.reload(); 
        if (data != 'passed') {
            jQuery('#payment_errors').html(data);
        }
        if (data == 'passed') {
            // alert('passed');
            //clear errors
            jQuery('#payment_errors').html("");
            jQuery('#step1').css("display","none");
            jQuery('#step2').css("display","block");
            jQuery('#next_button').css("display","none");
            jQuery('#back_button').css("display","inline-block");
            jQuery('#check_out_button').css("display","inline-block");
        }

    },
    error : function () {
        alert("Something wrong with the child options.");
    }
});