首页新闻找找看学习计划

JQuery中点击按钮,循环往下拉框中添加选项失败。为什么?

0
悬赏园豆:10 [已解决问题] 解决于 2013-12-13 14:34

省市选择中,点击一个按钮,往下拉框中添加地区数据。单条添加数据,能行。通过循环方式添加,失败。为什么?详细的代码如下。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>无标题页</title>

    <script src="Script/jquery-1.10.2.js" type="text/javascript"></script>

    <script type="text/javascript">
    $(function(){
        $('#btn').click(function(){
            var data="[{'Id':4,'Name':'邯郸市','Pid':1},{'Id':5,'Name':'石家庄','Pid':1},{'Id':6,'Name':'邢台市','Pid':1}]";
            var $pro=$('#selPro');
            data2Sel(data,$pro);
        });
    });
    
    function data2Sel(data,selOption){
        selOption.length=0;
        var res=eval(data);
       //循环添加失败,res[i].Id有值,opt.val()有值,opt.html()有值。但添加失败。为什么?
        for(var i=0;i<res.length;i++){
            var opt=$('<option value='+res[i].Id+'>'+res[i].Name+'</option>');
            selOption.append(opt);
        }
        //通过如下的方式添加成功。
        //         var $opt=$('<option value=1>河北省</option>');
        //         selOption.append($opt);
        //         $opt=$('<option value=1>河南省</option>');
        //         selOption.append($opt);
    }
    </script>

</head>
<body>
    <input type="button" id="btn" />
    <select id="selPro">
    </select>
</body>
</html>
cxiaoluab的主页 cxiaoluab | 初学一级 | 园豆:26
提问于:2013-12-13 13:49
< >
分享
最佳答案
0

我觉得是 selOption.length=0的原因,或者是var opt=$('<option value='+res[i].Id+'>'+res[i].Name+'</option>');

没必要加$();

这样写有点不太好。

var data 不用加引号。

 

function data2Sel(data,selOption){

    var opt ="";

    $.each(data,function(i,n)

    {

         opt += "<option value="+n.Id+">"+n.Name+"</option>"

    }

    selOption.append(opt);

}

收获园豆:10
|WinKi| | 小虾三级 |园豆:669 | 2013-12-13 14:18

嗯,谢谢你的启发!问题已经解决了!将 selOption.length=0 该为 selOption.empty()就OK了!

加$()是JQuery对象,不加是DOM对象,加不加都一样!

data加“”跟不加都行,只是我有点搞不懂,加与不加有什么不一样?

谢谢你的回答!

cxiaoluab | 园豆:26 (初学一级) | 2013-12-13 14:33

@cxiaoluab: 

首先加$()是没必要,这样会多加了消耗。

然后data加了"",你就得用eval(data),eval这个“邪恶”东西能不用尽量不用。

|WinKi| | 园豆:669 (小虾三级) | 2013-12-13 14:54

@|WinKi|: 嗯,知道了,谢谢指教!

cxiaoluab | 园豆:26 (初学一级) | 2013-12-13 15:30
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册