Java和JQuery UI的While循环失败

Question

我使用JQuery UI库和Dialog函数。

我想在我的JavaScript中创建多个触发器。

这是我的原始JS：

$j(function() {
    $j( "#dialog1" ).dialog({
        autoOpen: false,
        show: "slide",
        hide: "explode"
    });
    $j( "#dialog2" ).dialog({
        autoOpen: false,
        show: "slide",
        hide: "explode"
    });
    ...

    $j( ".opener1" ).click(function() {
        $j( "#dialog1" ).dialog( "open" );
        return false;
    })
    $j( ".opener2" ).click(function() {
        $j( "#dialog2" ).dialog( "open" );
        return false;
    })
    ...
});

我至少需要一打这些触发器。 因此，尽管如此，让我们制作一个PHP While循环。
像这样：

<?php
    $i = 1;
    while ($i <= 10) {
        echo '$j( "#dialog'.$i.'" ).dialog({
        autoOpen: false,
        show: "slide",
        hide: "explode"
        });';
    $i++;
    }

    $q = 1;
    while ($q <= 10) {
        echo '$j( ".opener'.$q.'" ).click(function() {
        $j( "#dialog1" ).dialog( "open" );
            return false;
        })';
    $q++;
    }?>

头while ，一切都很好。 它能解决问题。 但对于第二个while ，页面只是忽略了整个JS / PHP块...

我究竟做错了什么？

Answer 1

您的第二个while循环中的这一行：

$j( "#dialog1" ).dialog( "open" );

不应该这样：

$j( "#dialog' . $q . '" ).dialog( "open" );

目前，您所有的点击处理程序都将打开＃dialog1，我想这不是您要尝试执行的操作

您可以按照上面的建议在js中完成整个操作：

for (var i=1;i<=10;i++) {
  $j('#dialog' + i).dialog({
    autoOpen: false,
    show: "slide",
    hide: "explode"
  });

  $j('.opener' + i).click(function() {
    $j( "#dialog" + i).dialog( "open" );
    return false;
  }
}

Answer 2

至少在第一种情况下，您应该能够使用“多个选择器”，例如

$j( "#dialog1, #dialog2, #dialog3" ).dialog({
    autoOpen: false,
    show: "slide",
    hide: "explode"
});

编辑（“工作休息”后）

第二部分，您在函数内引用对象的位置，应如下所示：

$j( ".opener1, .opener2, .opener3" ).click(function() {
    $j(this).dialog( "open" );
    return false;
});

抱歉，我现在无法模拟，所以有点像在薄冰上行走-您会原谅我。

Answer 3

您可以仅使用jQuery生成上述所有内容，方法是使用一个类（将成为它们的选择器）链接所有对话框，并将打开器与它们各自的对话框链接，如以下示例所示：

http://jsfiddle.net/Awh7D/

注意：可以开发更好的方法来将打开器与其各自的对话框链接。

Answer 4

我同意克莱夫（Clive）的观点：

$q = 1;
    while ($q <= 10) {
        echo '$j( ".opener'.$q.'" ).click(function() {
        $j( "#dialog1" ).dialog( "open" );
            return false;
        })';
    $q++;
    }?>

应该 ：

$q = 1;
    while ($q <= 10) {
        echo '$j( ".opener'.$q.'" ).click(function() {
        $j( "#dialog'.$q.'" ).dialog( "open" );
            return false;
        })';
    $q++;
    }?>

Answer 5

您也可以在对话框/打开器之间共享一个类。 这是一个小提琴的例子

http://jsfiddle.net/ZbMcA/