AJAX使用新的echo输出实时更新PHP页面 - AJAX live update a PHP page with a new echo output

我目前在一家保险网站上工作，除了CSS和HTML之外，其他任何东西都让我有点不知所措。我最近刚刚学会了如何创建能吐出不同echo语句的变量链接。以下是一个原始页面的示例：http://www.mmisi.com/autoquote.php这里有一个可变链接：http://www.mmisi.com/autoquote.php?discount=safedriver

我想做的是在使用AJAX时使用这个类似的功能（好吧，我认为AJAX是我需要的），以便在点击链接后更新实时页面，而不必重新加载页面。

所以，我想做的是，让一个查看器位于autoquote.php上，并单击autoquote.php的链接？折扣=安全驾驶员。链接不是加载一个全新的页面，而是动态地吐出适当的echo语句。

这是我目前拥有的PHP：

$discount = $_GET['discount'];
if ( $discount == "safedriver" ) { echo "Ask about a safe driver discount, which could save you up to 25% for drivers with no violations or at-fault accidents!"; }

您不需要AJAX请求，但您可以：

您的HTML:

<a href="/autoquote.php?discount=safedriver" discount="safedriver" class="discount-class">Safe Driver</a>
<a href="/autoquote.php?discount=unsafedriver" discount="unsafedriver" class="discount-class">Unsafe Driver</a>
<span class="result"></span>

您的jQuery:

$(function(){
    $('a.discount-class').click(function(){
        $.get('/autoquoteAjax.php?discount=' + $(this).attr('discount'), function(data) {
            $('.result').html(data);
        });
    });
});

您的autoquoteAjax.php：

switch(trim($_GET['discount'])){
    case 'safedriver':
        echo "Ask about a safe driver discount, which could save you up to 25% for drivers with no violations or at-fault accidents!";
    break;
    case 'unsafedriver':
        echo "This will be expensive!";
    break;
}

请注意，discount="safedriver"不会在XHTML 中验证

您必须使用AJAX有什么特别的原因吗？您是否不仅可以将预设输出存储在javascript哈希图（即关联数组/对象）中，还可以根据用户选择的内容使用javascript将该特定行显示为<div>。似乎只是为了展示一些东西而提出请求会增加太多的开销。

另一种选择可以是将这些"线"设置为<页面上的p>标记（或其他），然后动态显示/隐藏它们。

一句话：您只需要能够将一些事件处理程序附加到HTML元素（它们不一定是<a>标记），就可以触发某种操作。显示/隐藏或基于一组预设行设置元素的innerHTML。

edit：但如果你一心想使用AJAX，那么你或多或少就走在了正确的轨道上。您需要做的是发出AJAX请求，然后将responseText分配给页面上某个元素的innerHTML。任何像样的AJAX教程都将为您提供如何实现XMLHttpRequest对象（IE与其他对象）以及如何打开（）、发送（）和检查状态的基础知识。例如，w3schools有一个很好的教程。http://www.w3schools.com/ajax/default.asp

我建议您看看jQuery，更具体地说，是.load（）-方法.

网上有很多教程和例子。

说实话，我不认为你应该为了专业目的而摆弄AJAX和PHP，除非你知道自己在做什么，因为有很多地方你会搞砸，让自己看起来很愚蠢

除此之外，我还相信这个社区总体上是一个很好的社区，如果你要求这样做，那是因为你的最后期限即将到来，而不是因为你太懒了无法学习这些语言。这就是为什么我会给你代码：

*注意，php应该放在一个名为/autoquoter.php 的单独页面上

JS:

function getXMLText(dname){
    if (window.XMLHttpRequest){
      xhttp=new XMLHttpRequest();
    }
    else{
      xhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xhttp.open("GET",dname,false);
    xhttp.send();
    return xhttp.responseText;
}
function safery(boolvar){
    if(boolvar){
        document.getElementById("changling").innerHTML = getXMLText("/autoquoter.php?discount=safedriver");
    }
    else{
        document.getElementById("changling").innerHTML = getXMLText("/autoquoter.php?discount=unsafedriver");   
    }
}

HTML:

<a href="javascript:safery(true)">I am a safe driver</a><br />
<a href="javascript:safery(false)">I am NOT a safe driver</a><br />
<div id="changling"> </div>

然后把这个放在autoquoter.php页面的顶部：

<?php switch(trim($_GET['discount'])){
    case 'safedriver':
        die("Ask about a safe driver discount, which could save you up to 25% for drivers with no violations or at-fault accidents!");
    break;
    case 'unsafedriver':
        die("This will be expensive!");
    break; } ?>

要将整个事情视为一个JSFiddle，请转到此处（当然没有php）。

现在你有一个截止日期，所以你可以停止阅读这里。我将把这个解释留给后人：

页面已加载
当用户单击链接时，javascript会查询该页面（autoquoter.php），并将其输出集中到名为changeling的空div中
autoquoter.php使用标准的switch语句根据其GET变量输出正确的警告