在循环中使用时对话框的宽度
Width of dialog when used in a loop
当我在循环中使用它时,我在控制对话框的宽度时遇到了问题(我在 for 循环中为每个选项设置了一个对话框)。
我的代码基于这个例子: http://api.jqueryui.com/dialog/#entry-examples ,当我按原样 运行 这个例子时,宽度函数工作得很好。
加上loop函数,那么widht就不行了
谁知道哪里出了问题?
我的代码:
<?php
$cars = array("Audi", "BMW", "Mercedes");
for($n=0;$n< sizeof($cars);$n++)
{
echo '<button class = "opener" index='.$n.'>'.$cars[$n].'</button> <br>';
echo '<div id="dialog-'.$n.'" title="'.$cars[$n].'">';
echo 'hey';
echo '</div>';
}
?>
<link rel="stylesheet"
href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
var i;
$( "#dialog-"+i ).dialog({
autoOpen: false,
height: '400',
width: '600',
modal: true,
close: function() {
}
});
$('.opener').on("click", function(){
i = this.getAttribute("index");
$('#dialog-'+i).dialog().dialog('open');
return false;
});
} );
</script>
$(function () {
var i;
var objDialogOptions = {
autoOpen: false,
height: '400',
width: '600',
modal: true,
close: function () {
//Callback on close of dialog
}
};
$('.opener').on("click", function () {
i = this.getAttribute("index");
$('#dialog-' + i).dialog(objDialogOptions).dialog('open');
return false;
});
});
希望这能解决问题
当我在循环中使用它时,我在控制对话框的宽度时遇到了问题(我在 for 循环中为每个选项设置了一个对话框)。 我的代码基于这个例子: http://api.jqueryui.com/dialog/#entry-examples ,当我按原样 运行 这个例子时,宽度函数工作得很好。 加上loop函数,那么widht就不行了
谁知道哪里出了问题?
我的代码:
<?php
$cars = array("Audi", "BMW", "Mercedes");
for($n=0;$n< sizeof($cars);$n++)
{
echo '<button class = "opener" index='.$n.'>'.$cars[$n].'</button> <br>';
echo '<div id="dialog-'.$n.'" title="'.$cars[$n].'">';
echo 'hey';
echo '</div>';
}
?>
<link rel="stylesheet"
href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
var i;
$( "#dialog-"+i ).dialog({
autoOpen: false,
height: '400',
width: '600',
modal: true,
close: function() {
}
});
$('.opener').on("click", function(){
i = this.getAttribute("index");
$('#dialog-'+i).dialog().dialog('open');
return false;
});
} );
</script>
$(function () {
var i;
var objDialogOptions = {
autoOpen: false,
height: '400',
width: '600',
modal: true,
close: function () {
//Callback on close of dialog
}
};
$('.opener').on("click", function () {
i = this.getAttribute("index");
$('#dialog-' + i).dialog(objDialogOptions).dialog('open');
return false;
});
});
希望这能解决问题