Question

我对编程比较陌生，所以我提前道歉;）。

我正在创建一个网站，其布局基于在线游戏的对话框。我现在约10个Dialogs，我可能需要创建更多。我需要一些用户可以随意移动，打开，关闭的东西。

我也有保存布局的功能，这就麻烦了：我们正在谈论很多代码（code.numerOfTypos = code.length ^ 2）;

看起来很难看，我百分百肯定，还有更好的方法。不是吗？

一些代码附加和摆弄。

var win_options = {
    pos: 1,
width: 1,
height: 1,
open: 0
};
var win_login = {
    pos: 1,
    width: 1,
    height: 1,
open: 0
};
var win_maincontrol = {
pos: 1,
width: 1,
height: 1,
open: 0
};

var win_menue = {
pos: 1,
width: 1,
height: 1,
open: 0
};


$(document).ready(function () {
    $('#win_login').dialog({
    width: 190,
    autoOpen: false,
    closeOnEscape: false
    });
    $('#win_login').dialog("open");
    $('#win_menue').dialog({
    closeOnEscape: false
    });
    $('#button').button();

    $('#win_options').dialog({
        closeOnEscape: false
    });
    $('#win_options_layout_save').click(function () {
    win_options.pos = $('#win_options').dialog("option", "position");
    win_options.width = $('#win_options').dialog("option", "width");
    win_options.height = $('#win_options').dialog("option", "height");
    win_options.open = $('#win_options').dialog("isOpen");
    win_login.pos = $('#win_login').dialog("option", "position");
    win_login.width = $('#win_login').dialog("option", "width");
    win_login.height = $('#win_login').dialog("option", "height");
    win_login.open = $('#win_login').dialog("isOpen");
    win_maincontrol.pos = $('#win_maincontrol').dialog("option", "position");
    win_maincontrol.width = $('#win_maincontrol').dialog("option", "width");
    win_maincontrol.height = $('#win_maincontrol').dialog("option", "height");
    win_maincontrol.open = $('#win_maincontrol').dialog("isOpen");
    win_menue.pos = $('#win_menue').dialog("option", "position");
    win_menue.width = $('#win_menue').dialog("option", "width");
    win_menue.height = $('#win_menue').dialog("option", "height");
    win_menue.open = $('#win_menue').dialog("isOpen");
    win_mapSystem.pos = $('#win_mapSystem').dialog("option", "position");
    win_mapSystem.width = $('#win_mapSystem').dialog("option", "width");
    win_mapSystem.height = $('#win_mapSystem').dialog("option", "height");
    win_mapSystem.open = $('#win_mapSystem').dialog("isOpen");
    win_mapStars.pos = $('#win_mapStars').dialog("option", "position");
    win_mapStars.width = $('#win_mapStars').dialog("option", "width");
    win_mapStars.height = $('#win_mapStars').dialog("option", "height");
    win_mapStars.open = $('#win_mapStars').dialog("isOpen");
    win_map2d.pos = $('#win_map2d').dialog("option", "position");
    win_map2d.width = $('#win_map2d').dialog("option", "width");
    win_map2d.height = $('#win_map2d').dialog("option", "height");
    win_map2d.open = $('#win_map2d').dialog("isOpen");
    win_2d.pos = $('#win_2d').dialog("option", "position");
    win_2d.width = $('#win_2d').dialog("option", "width");
    win_2d.height = $('#win_2d').dialog("option", "height");
    win_2d.open = $('#win_2d').dialog("isOpen");
    });
    $('#win_options_layout_load').click(function () {
    $('#win_options').dialog("option", "position", win_options.pos);
    $('#win_options').dialog("option", "width", win_options.width);
    $('#win_options').dialog("option", "height", win_options.height);
    if (win_options.open) {
        $('#win_options').dialog("open");
    } else {
        $('#win_options').dialog("close");;
    }
    $('#win_login').dialog("option", "position", win_login.pos);
    $('#win_login').dialog("option", "width", win_login.width);
    $('#win_login').dialog("option", "height", win_login.height);
    if (win_login.open) {
        $('#win_login').dialog("open");
    } else {
        $('#win_login').dialog("close");;
    }
    $('#win_maincontrol').dialog("option", "position", win_maincontrol.pos);
    $('#win_maincontrol').dialog("option", "width", win_maincontrol.width);
    $('#win_maincontrol').dialog("option", "height", win_maincontrol.height);
    if (win_maincontrol.open) {
        $('#win_maincontrol').dialog("open");
    } else {
        $('#win_maincontrol').dialog("close");;
    }
    $('#win_menue').dialog("option", "position", win_menue.pos);
    $('#win_menue').dialog("option", "width", win_menue.width);
    $('#win_menue').dialog("option", "height", win_menue.height);
    if (win_menue.open) {
        $('#win_menue').dialog("open");
    } else {
        $('#win_menue').dialog("close");;
    }
    });
    $('#win_options_layout_reset').click(function () {
    $('#win_options').dialog("option", "position", "center");
    $('#win_options').dialog("open");
    $('#win_login').dialog("option", "position", "top");
    $('#win_login').dialog("open");
    $('#win_maincontrol').dialog("option", "position", "left");
    $('#win_maincontrol').dialog("open");
    $('#win_menue').dialog("option", "position", "right");
    $('#win_menue').dialog("open");
});
$('#win_maincontrol').dialog({
    closeOnEscape: false
});
$('#win_maincontrol_button_exit').button({
    icons: {
        primary: "ui-icon-person",
        secondary: null
    }
});
$('#win_maincontrol_button_exit').click(function () {
    alert("Du kommst hier net rein!");
});
$('#win_maincontrol_button_walk').button({
    icons: {
        primary: "ui-icon-person",
        secondary: null
    }
});
$('#win_maincontrol_button_walk').click(function () {
    alert("Laufen ist anstrengend...");
});
$('#win_maincontrol_button_undock').button({
    icons: {
        primary: "ui-icon ui-icon-star",
        secondary: null
    }
});
$('#win_maincontrol_button_undock').click(function () {
    alert("Du kommst hier net raus!");
});
$('#win_maincontrol_button_hull_inspect').button({
    icons: {
        primary: "ui-icon-wrench",
        secondary: null
    }
});
$('#win_maincontrol_button_hull_inspect').click(function () {
    alert("Is doch heil!");
});
$('#win_maincontrol_button_systems_inspect').button({
    icons: {
        primary: "ui-icon-wrench",
        secondary: null
    }
});
$('#win_maincontrol_button_systems_inspect').click(function () {
    alert("Werner sacht: \"Lass das!\"");
});
$('#win_mapSystem').dialog({
    closeOnEscape: false
});
$('#win_mapStars').dialog({
    closeOnEscape: false
});
$('#win_map2d').dialog({
    closeOnEscape: false
});
$('#win_2d').dialog({
    closeOnEscape: false
});
$(document).keyup(function (e) {
    if (e.keyCode == $.ui.keyCode.ESCAPE) {
        $('#win_options').dialog("open");
    };
    });
});

Answer 1

我的一个朋友把我叫醒了：

$('#win_options_layout_load').click(function(){
            for (var i=0; i<win_name.length; i++) {
                $('#win_'+win_name[i]+'').dialog( "option", "position", win[i].pos);
                $('#win_'+win_name[i]+'').dialog( "option", "width", win[i].width);
                $('#win_'+win_name[i]+'').dialog( "option", "height", win[i].height);
                if (win[i].open) {$('#win_'+win_name[i]+'').dialog( "open");} else {$('#win_'+win_name[i]+'').dialog( "open");}
            }
        });

jQuery UI：需要优化Dialog创建/位置代码

1 个答案: