各位大哥请帮帮看看这个怎么处理(Ajax 下拉列表)

各位大哥，我用jquery的ajax调用做了一个产生下拉列表(select)的方法，如下：//方法定义：根据sql产生下拉列表
(function($){ 
          $.fn.setDDLWSql = function(sql){

                      $.get("setDDLSql.jsp",
                               {strSql:sql},
                              function(data){
                                         var arrOption = []; 
                                         var optionsTemp = data.split('@');
                                         for(var i = 0; i < optionsTemp.length; i = i + 2){
                                         arrOption[arrOption.length] = new Option(optionsTemp,optionsTemp[i+1]);
                             }
                             $('#setDDDWSql').get(0).options.add(new Option("请选择",""));

                             for(var i = 0; i < arrOption.length; i++){
                                         $('#setDDDWSql').get(0).options.add(arrOption); 
                               }
                  }
);

}
})(jQuery);

//ajax引用的jsp页面定义：
<%@ page contentType="text/html; charset=gb2312" language="java" errorPage="" %><%
        String sRequest = request.getParameter("strSql");        String strOptions = "北京@01@上海@02@天津@03"; //暂时写成这样，不从数据库中取数据了        out.print(strOptions);
%>

//方法调用： $("#setDDLWSql").setDDLWSql("select itemNo, itemName from code_library where codeNo = 'city'");
-----------------------------------------------------------------------------------------------------------------------
怎么才能在ajax的回调函数中知道调用元素呢？而不是这样指定： $('#setDDDWSql').get(0).options.add(new Option("请选择",""));
我试过把t $('#setDDDWSql')改为this了 不可以的。
应该怎么写 ？ 先谢谢各位大哥了。

你是要在点击下拉列表的时候加载列表项，还是做级联菜单

你用$(this)试试吧

首先，感谢大家的热心回答。

Re：ziyou：
我不是想点击的时候加载，是页面load是生成。 我只是想做出一个通用的根据sql产生下拉列表的通用方法，下面这样写就不通用了
  $('#setDDDWSql').get(0).options.add(new Option("请选择",""));
...  ...

    $('#setDDDWSql').get(0).options.add(arrOption);

为了便于维护，我的select选项是存贮在数据库中的。

re：jamix

可能我没说清楚： $('#setDDDWSql') 改为 $(this) 是不想的 。

谢谢热心回答哦！

(function($){
          $.fn.setDDLWSql = function(sql){
                      $.getJSON("setDDLSql.jsp",
                               {strSql:sql},
                               function(data){
                                          //返回值是json格式，你自己试试吧
                                         data=[{value:"01",text:"北京"},{value:"02",text:"上海"},{value:"03",text:"天津"}];
                                         var options="<option>请选择</option>";
                                          $.each(data,function(id,item){
                                                  options+="<option value="+item.value+">"+item.text+"</option>";
                                           });
                                          options+="</option>";
                                          $(this).html(options);
                                }
                      }
            }
);

}
})(jQuery);
$(document).ready(function(){
    $("#setDDDWSql").setDDLWSql(sql);
});

re :ziyou

我试了 不可以的 。我觉得是回调函数中的 this 所指不是 调用元素

但是 从回调函数中 引用 函数调用元素 应该怎么做呢？

还是要谢谢你. 你解决了分享一下 。 谢谢。

不会吧，我这个测试过了，可以加载上啊，你那报什么错

Re：ziyou
我这边是用   $(this).html(options);  报错 ：对象不支持的属性和方法

换为 $('#setDDDWSql').html(options); 就加载上了。但是用 $(this).html(options);   就报错

搞了一晚上终于搞出来了，分享一下(同步调用是关键，回调函数中的this不能代表调用对象的)。
现在还有一点小问题，希望大家帮忙解决下：

  $(this).css("width","100");

现在临时把select的宽度设置成了100， 怎么才能使select宽度自适应为最长的option的宽度呢？

我刚学习jquery和css，大家指导下啊。先谢谢了。

-------------------------------------------------------------------------------------------------------------------------------------

//自定义方法：根据sql产生下拉列表
      (function($){
        $.fn.setDDLWSql = function(sql){

            var optionHtml;

            function GetOptionsHtml(){
                var tmpOptionsHtml;

                $.ajax({
                        async:false,
                        type:"post",
                        url:"setDDLSql.jsp",
                        success:function(data){
                            var optionsHtml="<option>请选择</option>";
                            var optionsTemp = data.split('@');
                            for(var i = 0; i < optionsTemp.length; i = i + 2){
                                optionsHtml+="<option value="+optionsTemp[i+1]+">"+optionsTemp+"</option>";
                            }
                            optionsHtml+="</option>";
                            tmpOptionsHtml = optionsHtml;
                        }
                });
                return tmpOptionsHtml;
              }

              $(this).html(GetOptionsHtml());
              $(this).css("width","100");
          }  
    })(jQuery);


//ajax引用的jsp页面定义：
<%@ page contentType="text/html; charset=gb2312" language="java" errorPage="" %><%
        String sRequest = request.getParameter("strSql");        String strOptions = "北京@01@上海@02@天津@03"; //暂时写成这样，不从数据库中取数据了        out.print(strOptions);
%>

//方法调用： $("#setDDLWSql").setDDLWSql("select itemNo, itemName from code_library where codeNo = 'city'");

忘了你是要在回调函数中加载了，我直接测试的加载数据，没考虑到那个问题

谢谢 可以考虑一下 刚刚提的那个问题。 如何是select 自适应option的宽度。 一起学习下。

这几天都不能正常登录论坛，自动适应的问题，你是要自动适应当前选中的文本还是下拉列表中最长的文本

re :ziyou

当然是最长的文本了 。

不过这个方法只用来加载数据，再写一个方法设置外观也不错，或许这样是更好的设计模式。
我的qq： 314042555

哥们挺够意思，回了这么多贴子。加我QQ，现在在做一个根据sql生成列表的jquery方法。一起讨论下。