循环中的函数-JQuery

我试图在StackOverflow上搜索问题的解决方案，但没有找到。 我正在写一个不是我写的剧本。在JQuery中，处理它的人根本没有使用循环。所以我试图用循环重新编写代码

在乞讨会上，情况是这样的：

$(function() { $( "#dialog" ).dialog({ width: 550, autoOpen: false, modal: true, dialogClass: "dialog_style1", open: function() { $(".ui-widget-overlay").bind("click",function(){ $("#dialog").dialog("close"); }) } }); $( "#opener" ).click(function() { $( "#dialog" ).dialog( "open"); }); }); $(function() { $( "#dialog1" ).dialog({ width: 550, autoOpen: false, modal: true, dialogClass: "dialog_style1", open: function() { $(".ui-widget-overlay").bind("click",function(){ $("#dialog1").dialog("close"); }) } }); $( "#opener1" ).click(function() { $( "#dialog1" ).dialog( "open"); }); }); $(function() { $( "#dialog2" ).dialog({ width: 550, autoOpen: false, modal: true, dialogClass: "dialog_style1", open: function() { $(".ui-widget-overlay").bind("click",function(){ $("#dialog2").dialog("close"); }) } }); $( "#opener2" ).click(function() { $( "#dialog2" ).dialog( "open"); }); }); $（函数（）{ $（“#对话框”）。对话框({ 宽度：550， 自动打开：错误， 莫代尔：是的， dialogClass:“dialog_style1”， 打开：函数（）{ $（“.ui小部件覆盖”）.bind（“单击”，函数（）{ $（“对话框”）。对话框（“关闭”）； }) } }); $（“#开场白”）。单击（函数（）{ $（“对话框”）。对话框（“打开”）； }); }); $（函数（）{ $（“#对话框1”）。对话框({ 宽度：550， 自动打开：错误， 莫代尔：是的， dialogClass:“dialog_style1”， 打开：函数（）{ $（“.ui小部件覆盖”）.bind（“单击”，函数（）{ $（“对话1”）.dialog（“关闭”）； }) } }); $（“#opener1”）。单击（函数（）{ $（“对话1”）。对话（“打开”）； }); }); $（函数（）{ $（“#dialog2”）.dialog({ 宽度：550， 自动打开：错误， 莫代尔：是的， dialogClass:“dialog_style1”， 打开：函数（）{ $（“.ui小部件覆盖”）.bind（“单击”，函数（）{ $（“对话2”）.dialog（“关闭”）； }) } }); $（“#opener2”）。单击（函数（）{ $（“#dialog2”）.dialog（“打开”）； }); }); 因此，对于不同的对象，它是相同的函数。实际上，还有10次相同的代码^^。这就是为什么我尝试使用循环：while。所以我重写了整个代码来获得这个：

var i = 0 ;
while(i<12){

    $(function() {
        var dial = "";
        if(i != 0){ dial = "#dialog"+i; }else{ dial = "#dialog";}
        var opener = "";
        if(i != 0){ opener = "#opener"+i; }else{ opener = "#opener";}

        $(dial).dialog({
        width: 550,
          autoOpen: false,
        modal: true,
        dialogClass: "dialog_style1",
        open: function() {
            $(".ui-widget-overlay").bind("click",function(){
                $(dial).dialog("close");
            })
        }
        });

        $( opener ).click(function() {
          $( dial ).dialog( "open");
        });
    });

    i++;
}

var i=0；
while（i我猜你在while循环中有$（function（）{}）。这实际上是$（document）.ready（function（）{}）简写，而document ready只触发一次。试着把while放在document ready部分中。看看这是否有效。我会重写你的代码，使循环在函数中

像这样：

$(function() {
    var i = 0;
    while(i<12){        
        #code
        i++;
    }
});

$（函数（）{
var i=0；
while（i那么，首先应该绑定一个
ready
事件，而不是十二个，并将循环放在事件处理程序中

这将顺便解决变量的问题。当您在循环中绑定12个事件处理程序时，所有这些事件处理程序都将在循环结束后运行，
i
将为所有事件处理程序设置值
12
。通过在循环中直接运行代码，变量将为每个项目设置正确的值

但是，在
打开
和
单击
事件处理程序中使用的
拨号
变量仍然存在问题，因此需要一个函数为该变量创建闭包，以便循环中的每个迭代都有自己的
拨号
变量：

$(function() {

  for (var i = 0; i < 12; i++){

    var opener = i == 0 ? "#opener" : "#opener" + i;

    (function(dial){

      $(dial).dialog({
        width: 550,
        autoOpen: false,
        modal: true,
        dialogClass: "dialog_style1",
        open: function() {
          $(".ui-widget-overlay").bind("click",function(){
            $(dial).dialog("close");
          })
        }
      });

      $( opener ).click(function() {
        $( dial ).dialog( "open");
      });

    })(i == 0 ? "#dialog" : "#dialog" + i)

  }

});

$（函数（）{
对于（变量i=0；i<12；i++）{
var opener=i==0？#opener:“#opener”+i；
（功能（拨号）{
$（拨号）。对话框({
宽度：550，
自动打开：错误，
莫代尔：是的，
dialogClass:“dialog_style1”，
打开：函数（）{
$（“.ui小部件覆盖”）.bind（“单击”，函数（）{
$（拨号）对话框（“关闭”）；
})
}
});
$（开场白）。单击（函数（）{
$（拨号）对话框（“打开”）；
});
})（i==0？#dialog:“#dialog”+i）
}
});
感谢大家的回答。我尝试了所有的解决方案，但Guffa的解决方案对我有效。我没想到那些事件处理程序会在循环后运行，所以非常感谢你们的解释。：）
问题已解决！
您可能希望提交原始工作示例的jsbin以及您所尝试的内容。这将使我们能够更好地帮助您。