这是我使用Jquery的第一个项目。有两页。listofleaders.php 2。leadersprofile.php
在第一页,即listofleaders.php我有一个输入文本框,用户输入领导者的名字,我使用jQuery代码将文本框值传输到leaderprofile.php页面
<html>
<head>
<script>
function ls()
{
var leaderdetails = "leaderprofile.php?lname="+$("#gopal").val();
$.get(leaderdetails, function( data ) {
//alert(leaderdetails);
location.href = "leaderprofile.php";
});
}
</script>
</head>
<body>
<input type="text" id="gopal" name="t" placeholder="Start Typing" size="50" />
<button onclick="ls();" type="button">Go!</button><br><br>
</body>
</html>
在Second Page leadersprofile.php我写了这个
<?php
include "admin/includes/dbconfig.php";
$lname = $_GET['lname'];
echo $lname;
?>
但在第二页即leaderprofile.php它显示我的错误未定义索引:lname
我这样做对吗?我错在哪里?
所以根据你的问题描述,我在这里猜测你想要实现什么。
如果你想发送一个<input>
值到另一个页面,你最好使用一个经典的POST请求(不需要改进jQuery):
<form method="post" action="leadersprofile.php">
<input type="text" name="lname"/>
<button type="submit">Send</button>
</form>
和leadersprofile.php:
<?php
if($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['lname'])) {
$lname = $_POST['lname'];
var_dump($lname); // outputs whatever the user input was
}
现在如果你想发送数据到leadersprofile.php而不重新加载页面,你正在寻找一个Ajax请求(XmlHttpR request)。
jQuery(function($) {
$('form').on('submit', function(e) {
e.preventDefault(); // prevents default behavior that is submitting the form
$.ajax({
method: 'post', // can be also 'get'
url: 'leadersprofile.php',
data: {lname: $('input').val() },
success: function(html) {
$('div').html(html); // place whataver was printed in leadesrprofile.php into a div
},
error: function(r) { // fire if HTTP status code != 200
console.log(r);
}
});
});
});
您似乎正确使用了JQuery。提取值和发送GET请求的Javascript应该可以工作了。
您的误解在于如何检查PHP文件是否已接收到请求。这种重定向
location.href = "leaderprofile.php";
不会向您提供有关您刚刚发出的GET请求的任何信息。你可以试试:
location.href = "leaderprofile.php?lname=" + $("#gopal").val()
验证PHP和Javascript是否按预期运行。如果您看到了您所期望的值,那么我相信您已经确认了两件事:
- 成功从 文本框中提取正确的值
- GET请求成功,并且正在调用成功回调
listofleaders.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<form>
<table>
<tr>
<td>Name:</td>
<td><input type="text" id="name"></td>
</tr>
<tr>
<td></td>
<td><button id="submit">Submit</button></td>
</tr>
</table>
</form>
<script src = "jquery.js"></script>
<script src = "leader.js"></script>
</body>
</html>
当submit按钮被点击时,leader.js文件将获取文本框的值。
leader.js
$(document).ready(function() {
$('#submit').on('click', function(){
var name = $('#name').val();
$.ajax({
url:'leaderprofile.php',
type:'POST',
data:{'name':name},
success:function(data){
}
});
});
});
现在,这个leader.js文件将把name键发送到liderprofile.php.
之后php文件返回数据(name)到js文件.. js文件将警告name。
leaderprofile.php
<?php
$name = $_POST['name'];
echo $name;