How to get a value to one php page to another without reload with Ajax and JavaScript
本问题已经有最佳答案,请猛点这里访问。
1 2 3 4 5 6 7 8 9 10 11 12 13 | <html> <body> <form name="form1" id="main_form" method="post" target="_parent" action="checklogin.php"> <input name="myusername" type="text" id="myusername" placeholder="User Name Here"> <input name="mypassword" type="password" id="mypassword" placeholder="Password Here"> <input type="submit" name="Submit" id="gogogo" value="Login"> <p id="msg" name="msg"><?php echo $_GET['msg']; ?> </p> </form> </body> </html> |
所以这是我的登录表单,我使用
据我所知,有三种方法可以在客户端和服务器之间传递信息:
AJAX是普通的JavaScript,根据您的浏览器支持,您可能需要以几种不同的方式实现它以支持旧版本和新版本。大多数人使用jQuery的$ .ajax()函数,因为它使编写(和读取)更容易。
如果您不想要AJAX或页面重新加载,唯一的另一个选择是使用websockets,但是在特定的服务器端和客户端软件上存在很多依赖性。这是相对较新的,所以没有很多"初学者指南"。
不过,这可能会让你开始:http://www.phpbuilder.com/articles/application-architecture/optimization/creating-real-time-applications-with-php-and-websockets.html
这是一个使用简单的vanilla JavaScript的简单ajax请求
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | function request(url, callback) { var req = new XMLHttpRequest(); req.onreadystatechange = function() { if (req.readyState !== XMLHttpRequest.DONE) return; switch (req.status) { case 200: return callback(null, req.responseText); case 404: return callback(Error('Sorry, 404 error')); default: return callback(Error('Some other error happened')) } }; req.open("GET", url, true); req.send(); return req; } |
你可以像这样使用它
1 2 3 4 5 6 7 8 | var req = request('/some-data.json', function (err, res) { // check for error if (err) return console.error(err); // do something with the data console.log(JSON.parse(res)); }); |
请注意,您必须进行一些额外的研究才能在旧的IE浏览器上支持此功能。
唯一的方法是使用AJAX,使用JavaScript也更容易。使用jQuery库中的
示例(使用jQuery):
1 2 3 4 5 6 7 8 9 | <script type="text/javascript"> $("form#main_form").submit(function(e){ e.preventDefault(); //stops the form submitting normally var formData = $(this).serializeArray(); //make an array of the form data $.post("checklogin.php", formData, function(response){ //POST the form data to 'checklogin.php' console.log(response); //output PHP response to console }); }); |