jQuery Mobile AJAX无法加载页面

Question

echo '<script>
    function ' . $row['idname'] . 'Click(){
        $( "#flip-' . $row['idname'] . '" ).flipswitch( "disable" );
        var isOff = document.getElementById("flip-' . $row['idname'] . '").value;
        if(isOff == "off"){
            console.log("action.php?do=turn-off-' . $row["id"] . '");
            jQuery.ajax({
                url: "action.php?do=turn-off-' . $row["id"] . '",
                type: "GET",
                success:function (data) {
                    $( "#flip-' . $row['idname'] . '" ).flipswitch( "enable" );
                    console.log("SUCCESS!!");
                }
            });
        }else{
            console.log("action.php?do=turn-on-' . $row["id"] . '");
            jQuery.ajax({
                url: "action.php?do=turn-on-' . $row["id"] . ',
                type: "GET",
                success : function (data) {
                    $( "#flip-' . $row['idname'] . '" ).flipswitch( "enable" );
                    console.log("SUCCESS!!");
                }
            });
        }
    }
    </script><br>';

So my problem is that ajax doesn't even load the page that is requested.

It creates this code from the result of a MySQL query, so it's basically a JavaScript file in a PHP File. The target is an empty page that only has some functions.

The function is invoked onChange from this <select> :

echo '<div class="ui-field-contain" style="width: 100%;">
    <label for="flip-' . $row['idname'] . '">' . $row['name'] . '</label> 
    <select onchange="' . $row['idname'] . 'Click()" name="flip-' . $row['idname'] . '" id="flip-' . $row['idname'] . '" data-role="flipswitch">
        <option value="off" selected="">Aus</option> <option value="on">An</option> 
    </select>
 </div>';

Answer 1

This may solve the problem because it is not a nice way to just replace it with always. You might consider adding some error handling where no wrong elements are tested to be selected with the error message as a part of the id.

Deprecated jqXHR.success()

The issue may occur because this method is deprecated since jQuery 1.8. It has been replaced by jqXHR.done().

jQuery.ajax({
    url: "action.php?do=turn-on-' . $row["id"] . '",
    type: "GET",
    done: function (data) {
        $( "#flip-' . $row['idname'] . '" ).flipswitch( "enable" );
        console.log("SUCCESS!!");
    }
});

Suggesting another way

$.get("api.php", {
    do: "turn-on-' . $row["id"] . '"
}, function (data) {
    console.log(data);}
});