javascript php函数,从javascript调用PHP函数

Brett DeWoodyJason Russell提出了一个问题：Call php function from JavaScript，或许与您遇到的问题类似。

This is, in essence, what AJAX is for. Your page loads, and you add an event to an element. When the user causes the event to be triggered, say by clicking something, your Javascript uses the XMLHttpRequest object to send a request to a server.

After the server responds (presumably with output), another Javascript function/event gives you a place to work with that output, including simply sticking it into the page like any other piece of HTML.

You can do it "by hand" with plain Javascript , or you can use jQuery. Depending on the size of your project and particular situation, it may be more simple to just use plain Javascript .

Plain Javascript

In this very basic example, we send a request to myAjax.php when the user clicks a link. The server will generate some content, in this case "hello world!". We will put into the HTML element with the id output.

The javascript

// handles the click event for link 1, sends the query

function getOutput() {

getRequest(

'myAjax.php', // URL for the PHP file

drawOutput, // handle successful request

drawError // handle error

);

return false;

}

// handles drawing an error message

function drawError() {

var container = document.getElementById('output');

container.innerHTML = 'Bummer: there was an error!';

}

// handles the response, adds the html

function drawOutput(responseText) {

var container = document.getElementById('output');

container.innerHTML = responseText;

}

// helper function for cross-browser request object

function getRequest(url, success, error) {

var req = false;

try{

// most browsers

req = new XMLHttpRequest();

} catch (e){

// IE

try{

req = new ActiveXObject("Msxml2.XMLHTTP");

} catch(e) {

// try an older version

try{

req = new ActiveXObject("Microsoft.XMLHTTP");

} catch(e) {

return false;

}

}

}

if (!req) return false;

if (typeof success != 'function') success = function () {};

if (typeof error!= 'function') error = function () {};

req.onreadystatechange = function(){

if(req.readyState == 4) {

return req.status === 200 ?

success(req.responseText) : error(req.status);

}

}

req.open("GET", url, true);

req.send(null);

return req;

}

The HTML

test

waiting for action

The PHP

// file myAjax.php

echo 'hello world!';

?>

With a javascript library (jQuery et al)

Arguably, that is a lot of Javascript code. You can shorten that up by tightening the blocks or using more terse logic operators, of course, but there's still a lot going on there. If you plan on doing a lot of this type of thing on your project, you might be better off with a javascript library.

Using the same HTML and PHP from above, this is your entire script (with jQuery included on the page). I've tightened up the code a little to be more consistent with jQuery's general style, but you get the idea:

// handles the click event, sends the query

var function getOutput() {

$.ajax({

url:'myAjax.php',

complete: function (response) {

$('#output').html(response.responseText);

},

error: function () {

$('#output').html('Bummer: there was an error!');

}

});

return false;

}

Don't rush out for jQuery just yet: adding any library is still adding hundreds or thousands of lines of code to your project just as surely as if you had written them. Inside the jQuery library file, you'll find similar code to that in the first example, plus a whole lot more. That may be a good thing, it may not. Plan, and consider your project's current size and future possibility for expansion and the target environment or platform.

If this is all you need to do, write the plain javascript once and you're done.

Documentation

希望本文对你有帮助，欢迎支持JavaScript中文网