Ajax发布不起作用

I'm new in ajax and try to get data from a post request. This is my code:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>
$(document).ready(function(){

    $("button").click(function(){

  $.post("10.0.0.10/info/page.php",
        {
          id: "1234"
        },
        function(data,status){
            alert("succesData: " + data + "
Status: " + status);
        })  
        .fail(function(data,status) {
            alert("failData: " + data + "
Status: " + status);
  });
    }); 
    });
</script>

</head>
<body>
<input id="id" type="text">
<button>Change Content</button>
</body>
</html>

I just try page.php page with html form and get this json:

[{"cabin_id":"1234","city":"","type":"","year":"2009"}]

So 10.0.0.10/info/page.php working fine but my ajax code can't get data. I only get .fail alert box and it says:

alert box

What is wrong on my ajax code?

EDIT:

I see this error now:

XMLHttpRequest cannot load file:///C:/Users/KUVALYA/Desktop/post. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

If you don't specify the scheme (e.g. https://) or start the URL with // (indicating that it is relative to the current scheme) then the first part will be treated as a directory, not a hostname.

You are requesting something like: http://example.com/foo/10.0.0.10/info/page.php.

Correct your URL.

Looking from the IP address, i think its external domain.

Your ajax will never work unless you enable Cross Origin Resource Sharing on the target IP

Please enable CORS by setting appropriate headers as mentioned in the following link and then use ajax on the target.

More info here

If possible, you can use JSON padding (JSONP) but that too requires customizing the response at the server side

Hope it helps!