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

Question

以下代码将无法执行我希望的操作，即单击由PHP代码创建的div =“ dist” li时运行Ajax函数。

请指导。

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

在click函数中，您需要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 个解决方案

解决方案1
0 2010-08-02 11:01:37

解决方案2
0 2010-08-03 16:13:53

解决方案3
0 2010-08-07 04:20:42

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

问题描述

3 个解决方案

解决方案1 0 2010-08-02 11:01:37

解决方案2 0 2010-08-03 16:13:53

解决方案3 0 2010-08-07 04:20:42

解决方案1
0 2010-08-02 11:01:37

解决方案2
0 2010-08-03 16:13:53

解决方案3
0 2010-08-07 04:20:42