zoukankan      html  css  js  c++  java
  • 对AJAX的理解

    Google 建议使用 XMLHttpRequest 对象来创建一种动态性极强的 web 界面:当您开始在 Google 的搜索框中输入查询时,JavaScript 会向某个服务器发出这些字词,然后服务器会返 回一系列的搜索建议

    通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

    XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

     1 创建 XMLHttpRequest 对象的语法:

    variable=new XMLHttpRequest();

    2 向服务器发送请求
    xmlhttp.open("GET","test1.txt",true);
    xmlhttp.send();

    3 服务器响应
    如需获得来自服务器的响应,请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。

    类似google输入提示

    <html>
    <head>
    <script type="text/javascript">
    function showHint(str)
    {
    var xmlhttp;
    if (str.length==0)
      { 
      document.getElementById("txtHint").innerHTML="";
      return;
      }
    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
    else
      {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function()
      {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("GET","/ajax/gethint.asp?q="+str,true);
    xmlhttp.send();
    }
    </script>
    </head>
    <body>
    
    <h3>请在下面的输入框中键入字母(A - Z):</h3>
    <form action=""> 
    姓氏:<input type="text" id="txt1" onkeyup="showHint(this.value)" />
    </form>
    <p>建议:<span id="txtHint"></span></p> 
    
    </body>
    </html>

    http://www.w3school.com.cn/tiy/t.asp?f=ajax_suggest

    自信与努力 用心坚持
  • 相关阅读:
    【转载】微服务,我们需要哪些基础框架?
    Flume多Sink方案修正
    Linux find命令
    Kafka日志及Topic数据清理
    Kafka日志清除策略
    Oracle误删除数据的恢复方法
    Kafka中Topic级别配置
    Kafka server部署配置优化
    配置Kafka集群和zookeeper集群
    改变家目录
  • 原文地址:https://www.cnblogs.com/kyxyes/p/3439094.html
Copyright © 2011-2022 走看看