Javascript 内部循环<；选择>；使用jQuery_Javascript_Jquery_Html

Javascript 内部循环<；选择>；使用jQuery

javascript jquery html

Javascript 内部循环<；选择>；使用jQuery,javascript,jquery,html,Javascript,Jquery,Html,我不知道为什么这个代码不起作用： $("body").append("<select>"); for (j in boxes[i].ex_options ){ $("body").append("<option>"+boxes[i].ex_options[j]+"</option>"); } $("body").append("</select>"); 谢谢append（），正

我不知道为什么这个代码不起作用：

$("body").append("<select>");

    for (j in boxes[i].ex_options ){

       $("body").append("<option>"+boxes[i].ex_options[j]+"</option>");

                    }

$("body").append("</select>");

谢谢

append（）

，正如@ArunPJohny所指出的，它不会连接字符串；它附加DOM元素。当您添加第一个

时，它会创建一个

元素，然后在其外部添加一堆

。您可以创建一个元素并将一个

数组传递给

append（）

，如下所示：

$("body").append(
    $("<select>").append(
        $.map(boxes[i].ex_options, function(option) {
            return $("<option>").text(option);
        })
    )
);

$（“正文”）.append(
$（“”）。附加(
$.map（框[i].ex_选项，函数（选项）{
返回$（“”）。文本（可选）；
})
)
);


$（函数（）{
$（'.datepick'）.datepick（{
日期格式：“dd/mm/yyyy”，showTrigger:“#calImg”}）；
});
$（文档）.ready（函数（）{
变量框=函数（ex_解决方案、ex_img、ex_选项）{
this.ex_solution=ex_solution；
this.ex_img=ex_img；
this.ex_options=ex_options；
}
变量框=[]；
框。推送（新框（“解决方案1”、“图像/caja1>”、[“解决方案1.1”、“选项1.2”、“选项1.3”））；
$（“正文”）。追加（“”）；
$.each（框[0]。ex_选项，函数（索引，值）{
console.debug（值）；
$（“正文选择”）.append（“+value+”）；
});
});

append（）

不是字符串连接函数对不起，bucle不是英文单词，我指的是循环。Arun P Johny，我应该用什么来代替？原因append（）通常用于添加html代码。这是非常低效的，如果页面上有任何其他

，效果也不会很好…真的。我不是为了效率。只是试图说明他/她的代码哪里出了问题，对原始代码的更改越少越好。感谢您的反馈。也许正如@minitech所说的，当我尝试此操作时，它会将每个选项添加到每个选择框中，从而产生一个包含所有其他选项的第一个选择框。唯一好的是最后创建的节点。当我尝试这段代码时，我得到了以下错误：试图在不存在节点的上下文中引用节点。如果我理解的话，这是在创建一个对话框并引入框[I]的内容。框内的ex_选项被包围，不是吗？我当时不明白的是，为什么这样做有效，而select不起作用：$（“body”）.append（“”+box[I].ex_solution+”

”$（“正文”）。附加（“”）；谢谢你的邀请help@pboest：我试着在第二句中解释它–如果你想这样想的话，第一句

append（）

会自动关闭

。至于那个错误…你能做一个JSFIDLE/CodePen吗？也许我实现错了，我试过。。感谢您的帮助：

$("body").append(
    $("<select>").append(
        $.map(boxes[i].ex_options, function(option) {
            return $("<option>").text(option);
        })
    )
);

<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<link rel="stylesheet" type="text/css" href="http://brenda.upreach.org.uk/plugins/jquery.datepick.package-4.1.0/redmond.datepick.css"> 
    <script type="text/javascript" src="http://brenda.upreach.org.uk/plugins/jquery.datepick.package-4.1.0/jquery.datepick.js">  </script>


    <script type="text/javascript" language="javascript">
    $(function() {
        $('.datepick').datepick({ 
                dateFormat: 'dd/mm/yyyy', showTrigger: '#calImg'});
    });


    $(document).ready(function(){

        var Box = function (ex_solution, ex_img, ex_options) {
            this.ex_solution    = ex_solution;
            this.ex_img         = ex_img;
            this.ex_options     = ex_options;
        }

        var boxes = [];
        boxes.push(new Box ("solution1","images/caja1>",["solution 1.1", "option 1.2", "option 1.3"]));

        $("body").append("<select></select>");
        $.each(boxes[0].ex_options, function(index, value){
            console.debug(value);
            $("body select").append("<option>"+value+"</option>");
        });

    });
    </script>

    <body></body>