用户名失去焦点ajax请求后台,页面以下拉列表的形式展示相应的数据

原创 2015年07月10日 09:11:31

   <input  id="username" class="txt5" tabindex="1"
                             accesskey="n" path="username" autocomplete="false"/><font id='f1' color='red'></font>
                <li class="txt6">注册邮箱、用户名、手机号均可作为登录帐号。</li>

 <select id="currentSite" name="currentSite" style="width: 200px;height: 30px;" class="vertical-align" tabindex="3" path="currentSite" accesskey="s" autocomplete="off">
                    <option value=""  >--------请选择站点--------</option>
  </select>



<script type="text/javascript">
    function test1(){
        takeSites();
    };
    window.onload=function(){
        setTimeout("test1()",500);
    };
    var map = new Object();
    map.put = function (key,value){
        var s = key + ' = "' + value + '";';
        eval(s);
    }
    map.get = function (key) {
        var v = eval(key + ";");
        return v;
    };
    map.put("D00L","国贸站");
    map.put("A001","站点1");
    map.put("A002","站点2");
    map.put("A003","站点3");
    map.put("A004","站点4");
    map.put("A005","站点5");
    map.put("A006","站点6");
    map.put("A007","站点7");
    map.put("A008","站点8");
    map.put("A009","站点9");
    map.put("A010","站点10");
    $.get("${ihomeModule}/sitesName.html",
            function(ret){
                if( ret=="null"||ret==""||ret==null){
                    alert("获取站点目录出错");
                    return;
                }else {
                   var maps=JSON.parse(ret);
                    for(var key in maps){
                        map.put(key,maps[key]);
                    }
                }
            });
    function reloadCaptchaImg(){
        var i = Math.random();
        var captchaImg =document.getElementById("captchaImg");
        captchaImg.src=captchaImg.src+'?i='+i;//这个特别重要
    }
    function takeSites(){
        $("#f1").text("");
        var username=$("#username").val();
        if(username==""){
            return;
        }else{
            var re=/^\w+$/;//验证由数字、26个英文字母或者下划线组成的字符串:
            var re1=/^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/;//匹配邮箱
            if(re1.test(username)||re.test(username)){//匹配成功
                $.get("${ihomeModule}/site.html", { username: username},
                        function(ret){
                            if( ret=="null"||ret==""||ret==null){
                                $("#f1").text("用户不存在");
                                $("#currentSite").empty().append(" <option value=''>--------请选择站点--------</option>");
                                return;
                            }else if(ret=="moreTimes"){
                                $("#f1").text("访问次数过多");
                                return;
                            }
                            var site=ret.trim().split(",");
                            $("#currentSite option").remove();
                            for (var i=0; i<site.length; i++ ){
                                $("#currentSite").append("<option value='"+site[i]+"'>"+map.get(site[i])+"</option>");
                            }
                        });
            }else{
                $("#f1").text("用户名不合法");
            };
        }
    }
    
    //用户名失去焦点
    $("#username").blur(function(){
        takeSites();
    });
</script>


jquery实现触发、失去焦点操作并执行ajax操作

js--------------------------------------------------------------------------------------------------...
  • u014737582
  • u014737582
  • 2015年11月17日 16:31
  • 4326

触发焦点事件,调用ajax。 触发点击事件调出新小窗口,调用ajax

实例1 js事件方法 function blurprice(id,price){ var act_price=$('#act_price_'+id).val(); ...
  • A9925
  • A9925
  • 2015年07月28日 13:55
  • 1617

用Ajax移动窗口

   _xWin        "+ ""+ "" + this.title + ""+ "0"+ "r"+ ""+ "" + this.message + ""+ ""+ "";document.b...
  • elvis456
  • elvis456
  • 2008年07月03日 11:16
  • 380

jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表

从后台获取json数据,将内容填充到下拉列表,代码非常简单,具体过程请看下面代码。 需求:url:链接     par:ID       sel:下拉列表选择器 function BuildSel...
  • HUXU981598436
  • HUXU981598436
  • 2016年06月16日 19:32
  • 6391

ajax请求数据,后台提供数据返回json, 前台js拼html,回填

ajax请求 /*全民看盘*/ $('#qmkp').click(function () { if($("#qmkps tr").length>0){ }else{ var Aj...
  • A9925
  • A9925
  • 2016年08月09日 14:40
  • 2701

Ajax 完整教程

第 1 页 Ajax 简介 Ajax 由 HTML、JavaScript™ 技术、DHTML 和 DOM 组成,这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。本...
  • my98800
  • my98800
  • 2016年03月14日 08:27
  • 978

Ajax应用

Asynchronous JavaScript and XML Ajax 由 HTML、JavaScript™ 技术、DHTML 和DOM组成Ajax关键是一个称为XMLHttpRequest的Jav...
  • swfcsunboy
  • swfcsunboy
  • 2008年05月02日 08:28
  • 607

jquery ajax 从后台获取数据到界面

jquery ajax 从后台获取数据到界面 jquery ajax从后台获取  从把需要传的元素按照格式什么,如下例子中的yesNum,noNum,然后通过response.getWrite...
  • wang863628979
  • wang863628979
  • 2016年08月08日 10:59
  • 1178

Ajax 异步或取后台数据json显示到页面

今天心情很好,终于写出来了用Ajax异步获取数据,不刷新页面。         后台方法:         @RequestMapping("/uspaces.html" ) public vo...
  • u013227081
  • u013227081
  • 2014年12月10日 16:54
  • 3563

ajax

function addcommodity(){                 var name = $('#cname').val(), price = $('#cprice').val(); ...
  • helloxiaoliang
  • helloxiaoliang
  • 2015年08月05日 17:10
  • 249
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:用户名失去焦点ajax请求后台,页面以下拉列表的形式展示相应的数据
举报原因:
原因补充:

(最多只允许输入30个字)