[英]Correct syntax to get my Ajax function to work
The following code will not do what I hoped, that is run the Ajax function when the div ="dist" li created by the PHP code's is clicked. 以下代码将无法执行我希望的操作,即单击由PHP代码创建的div =“ dist” li时运行Ajax函数。
Guidance please. 请指导。
<?php
// ...
$result = mysql_query($sql);
echo "<div class=\"dist\">";
echo "<ul>";
while ($row = mysql_fetch_array($result)) {
echo "<li><a href=\"devplan.php?search-n=" . $row['NAME'] .
"&" . rawurlencode($row['PLAN']) . "\"" . ">" .
$row['PLAN'] . "</a></li>";
};
echo "</ul>";
echo "</div>";
?>
<script type="text/javascript">
// Code to fill center panels with data
urlquery = location.search;
urlparts = urlquery.split('&');
urlplan = urlparts[1];
$(document).ready(function() {
$('.dist a').click(function() {
$.ajax({
url: 'php/dpdetails.php?q='+urlplan,
success: function (data) {
$('#Pinfo').html(data);
}
});
});
});
</script>
Here is a starter for ten - I've corrected some additional braces and added error handling. 这是一个十人入门-我已更正了一些额外的花括号并添加了错误处理。 If you still get an error, at least you@ll be able to tell us what it is.
如果您仍然遇到错误,至少您可以告诉我们它是什么。
$.ajax({
url: 'php/dpdetails.php?q='+urlplan,
success: function (data) {
$('#Pinfo').html(data);
},
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}
});
I'd add a console.log(urlplan) right after the click event handler. 我将在click事件处理程序之后添加console.log(urlplan)。 make sure that returned value works if you manually enter
如果您手动输入,请确保返回值有效
php/dpdetails.php?q=test&anotherVar=5
into the address bar. 进入地址栏。
What does console.log(urlplan) return? console.log(urlplan)返回什么?
Here is a sample piece of code: 这是一段示例代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>What</title>
</head>
<body>
<?php
$anchorList = "";
$rows = array(
array(
'NAME' => 'me1'
, 'PLAN' => 'thePlan1'
)
, array(
'NAME' => 'me2'
, 'PLAN' => 'thePlan2'
)
);
$anchorList .= "<div class=\"dist\">";
$anchorList .= "<ul>";
foreach ($rows as $row) {
$anchorList .= "<li>";
$anchorList .= createAnchorTag($row['NAME'], $row['PLAN']);
$anchorList .= "</li>";
}
$anchorList .= "</ul>";
$anchorList .= "</div>";
echo $anchorList;
function createAnchorTag($name, $plan) {
return "<a href=\"devplan.php?search-n=" . $name . "&" . rawurlencode($plan) . "\"" . ">" . $plan . "</a>";
}
?>
</body>
</html>
<script type="text/javascript" src="../scripts/jquery-1.4.2.modified.js"></script>
<script type="text/javascript">
// Code to fill center panels with data
urlquery = location.search;
urlparts = urlquery.split('&');
urlplan = urlparts[1];
$(document).ready(function() {
$('.dist a').click(function() {
$.ajax({
url: 'php/dpdetails.php?q=' + urlplan,
success: function (data) {
$('#Pinfo').html(data);
}
});
return false;
});
});
</script>
In your click function you need to return false
in order to override the anchor tags wanting to redirect. 在click函数中,您需要
return false
来覆盖要重定向的锚标记。
[EDIT] [编辑]
I believe your actually looking to parse the href
attribute of the anchor tag and pass it to the Ajax, right? 我相信您实际上是想解析锚标记的
href
属性并将其传递给Ajax,对吗? If so use this script: 如果是这样,请使用以下脚本:
<script type="text/javascript">
$(document).ready(function() {
$('.dist a').click(function() {
var urlquery = $(this).attr('href').val();
// regex would be better than split, could create a more generic function
var urlparts = urlquery.split('&');
var urlplan = urlparts[1];
$.ajax({
url: 'php/dpdetails.php?q=' + urlplan,
success: function (data) {
$('#Pinfo').html(data);
}
});
return false;
});
});
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.