如何使用Ajax加载内容 [英] How to load content using Ajax

问题描述

我想使用ajax和jquery加载数据库内容.我已经写了一个javascript，它可以正常工作，但是我无法为ajax jquery正确地编写代码.有人请给我一些例子吗?

I want to load my database content using ajax and jquery. I already write a javascript and it works correctly but I can't write correctly for ajax jquery. Anyone please give me some example?

我的JavaScript代码:

my javascript code:

<script language="javascript">
    function getfilter(str){

    document.getElementById("result").innerHTML="<div class='sparea'><i class='fa fa-spinner fa-spin sparea' ></i><div></script";

    if (str==""){
        document.getElementById("result").innerHTML="";
        return;
    }
    xmlhttp=new XMLHttpRequest();
    xmlhttp.onreadystatechange=function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            document.getElementById("result").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","Views/pfolioresult.php?q="+str,true);
    xmlhttp.send();
}
</script> 

<div class="sprocket-mosaic-header">
    <div class="sprocket-mosaic-filter">
        <ul>
            <li class="all active" data-mosaic-filterby="all" onclick="getfilter(this.id)" id="all" >All</li>
            <li class="android" data-mosaic-filterby="android" onclick="getfilter(this.id)" id="android" >Android</li>
            <li class="iOS" data-mosaic-filterby="iOS" onclick="getfilter(this.id)" id="ios" >IOS</li>
        </ul>
    </div>
    <div class="clear"></div>
</div>


<div id="result">
    ok
</div>

推荐答案

执行此操作

function getfilter(str){

    document.getElementById("result").innerHTML="<div class='sparea'><i class='fa fa-spinner fa-spin sparea' ></i><div></script";

    if (str==""){
        document.getElementById("result").innerHTML="";
        return;
    }

    $.ajax({
        url: "Views/pfolioresult.php",
        type: "GET",
        data: { q : str },
        success: function ( responseText ) {
            $("#result").html( responseText );
        }
    });
}

从这里

了解 : https://api.jquery.com/jQuery.ajax/

这篇关于如何使用Ajax加载内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！