• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    ajax实现输入提示效果

    本文实例为大家分享了ajax实现输入提示效果的具体代码,供大家参考,具体内容如下

    网站主页

    !DOCTYPE html>
    html lang="en">
    head>
      meta charset="UTF-8">
      title>Title/title>
      style>
        *{
          margin:0px auto;
          padding:0px;
        }
        .l{
          height:50px;
          width:198px;
          border-bottom:1px solid black;
          text-align: center;
          line-height:40px;
          vertical-align: middle;
        }
      /style>
      script src="../wenjian/jquery-2.2.3.min.js">/script>
    /head>
    body>
    div style="height: 50px;width: 200px">input type="text" id="name" style="width: 198px;height: 48px;">/div>
    div id="list" style="height: 500px;width: 200px;border: 1px solid black">
    !--div id="l">zhongguo/div>-->
    /div>
    
    /body>
    /html>
    script>
    $("#name").keyup(function () {
      var n = $("#name").val();
      if (n != ""){
      $.ajax({
        url:'ltchuli.php',
        data:{n:n},
        type:'post',
    //    dataType:'text',
        dataType:'json',
        success:function (data) {
    //text写法
    //     var s = data.split("|");
    //     var str = "";
    //     for (var i=0;is.length;i++)
    //     {
    //       str = str + "div class='l'>" +s[i] +"/div>";
    //     }
    //     $("#list").html(str);
    //json写法
    
          for (var i in data){
            $("#list").append("div class='l'>" +data[i] +"/div>");
          }
        }
      });
    }else {
        $("#list").html("");
      }
    })
    /script>
    
    

    处理页面

    ?php
    /**
     * Created by fcc
     * User: Administrator
     * Date: 2017/10/30
     * Time: 9:52
     */
    $n = $_POST['n'];
    require_once "../wenjian/DBDA.class.php";
    $db = new DBDA();
    $obj = "select region_name from region WHERE region_name LIKE '%{$n}%' ";
    $data = $db->Query($obj);
    //echo $data;
    echo json_encode($data);
    

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

    您可能感兴趣的文章:
    • jquery ajax请求方式与提示用户正在处理请稍等
    • php+ajax做仿百度搜索下拉自动提示框(有实例)
    • ajax 自动完成下拉框 自动提示位置问题
    • asp+ajax仿google搜索提示效果代码
    • jquery+ajax+text文本框实现智能提示完整实例
    • jquery实现ajax加载超时提示的方法
    • 使用jQuery全局事件ajaxStart为特定请求实现提示效果的代码
    • Ajax实现智能提示搜索功能
    • Ajax带提示的验证表单实例
    • jquery formValidator插件ajax验证 内容不做任何修改再离开提示错误的bug解决方法
    上一篇:简单实现ajax三级联动效果
    下一篇:ajax跳转到新的jsp页面的方法
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    ajax实现输入提示效果 ajax,实现,输入,提示,效果,