我使用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块…
我做错了什么?
第二个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;
}
}
您可以仅使用jQuery通过使用一个类(它将成为它们的选择器)链接所有对话框来生成上述所有内容,并将打开器与它们各自的对话框链接起来,如下面的示例所示:
http://jsfiddle.net/Awh7D/至少在第一种情况下,你应该能够使用"多个选择器",就像在
$j( "#dialog1, #dialog2, #dialog3" ).dialog({
autoOpen: false,
show: "slide",
hide: "explode"
});
编辑(在"working break"之后)
第二部分,即在函数内部引用对象的地方,应该像这样工作:
$j( ".opener1, .opener2, .opener3" ).click(function() {
$j(this).dialog( "open" );
return false;
});
对不起,我现在不能模拟,所以有点如履薄冰,你会原谅我的。
我同意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++;
}?>
您还可以在对话框/打开器之间共享一个类。下面是一个简单的例子
http://jsfiddle.net/ZbMcA/