Question

以下代码不会按照我的意愿执行，即在div =“dist”li时运行Ajax函数单击PHP代码创建的。

指导请。

<?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>

Answer 1

这是十个启动器 - 我已经纠正了一些额外的括号并添加了错误处理。如果你仍然收到错误，至少你可以告诉我们它是什么。

$.ajax({
    url: 'php/dpdetails.php?q='+urlplan,
    success: function (data) {
        $('#Pinfo').html(data);
    },
    error: function (xhr, ajaxOptions, thrownError) {
        alert(xhr.status);
        alert(thrownError);
    }
});

Answer 2

我会在click事件处理程序之后添加一个console.log（urlplan）。如果手动输入

，请确保返回的值有效

php/dpdetails.php?q=test&anotherVar=5

进入地址栏。

console.log（urlplan）返回什么？

Answer 3

以下是一段代码示例：

<!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>

在点击功能中，您需要return false才能覆盖想要重定向的锚标记。

<强> [编辑]

我相信您实际上想要解析锚标记的href属性并将其传递给Ajax，对吧？如果是这样，请使用此脚本：

<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>

正确的语法使我的Ajax函数工作

3 个答案: