0

これにどのタイトルを付けるべきかわかりませんが、頭を悩ませている問題に直面しています.

マップ上に描画するプロジェクトに取り組んでいます。マップにはさまざまな部屋があり、各部屋のサイズは異なります。新しい部屋を選択すると、マップのサイズが変更されます。jquery の先頭に作成した配列にすべてのサイズを格納します。開始したい部屋を選択する必要があるため、基本的にページの読み込み時に再スケーリングを行います。この再スケーリングは正常に機能するため、そのコードを関数に複製しましたが、そこでは動作したくないようです

部屋を構築するために使用する配列：

var hal1 = { id: 1, x: '0', y: '0', width: '114', height: '81', hal: 'Brabanthal'};
var hal2 = { id: 2, x: '0', y: '0', width: '33', height: '60', hal: 'Kempenhal'};
var hal3 = { id: 3, x: '0', y: '0', width: '87', height: '66', hal: 'Langstraathal'};  
var hal4 = { id: 4, x: '0', y: '0', width: '42', height: '47', hal: 'Diezehal'};  
var hal5 = { id: 5, x: '0', y: '0', width: '72', height: '57', hal: 'Peelhal'};  

var hallen = [ hal1, hal2, hal3, hal4, hal5 ];

これは、ページの読み込み時に再スケーリングするために使用するコードです

var hal = getUrlVars()["hal"];
if(typeof(hal) === 'undefined') hal=1;

var items = $.grep(hallen, function(x) {
    return x.id == hal
})

$(document).ready( function() {
    $.map(items, function(itemhal) {
     halw = itemhal.width;
     halh = itemhal.height;
     $('#mapDrag').width((Math.round(gridStand)*halw)*2).height((Math.round(gridStand)*halh)*2);
    });
});

上記のコードはすべて完全に機能しますが、次の機能では機能しません。クリックすると、ドロップダウンメニューから別の部屋を選択して、部屋（アイテム）のIDを送信し、それで機能を実行できます。次に、すべての新しいデータを div mapdrag にロードし、配列で指定されたサイズに再調整する必要があります。最初のページのロード時と同様に、id と一致します。

機能していない関数:

function changeHal(item) {
    if (hal != $(item).attr('halNr')) {
        hal = $(item).attr('halNr');
        var halXhr = jQuery.ajax({
            type: "POST",
            url: "ajax/hal.php",
            data: 'hal=' + hal,
            cache: false,
            success: function (response) {
                var items = $.grep(hallen, function (x) {
                    return x.id == hal
                })
                $.map(items, function (itemhal) {
                    halw = itemhal.width;
                    halh = itemhal.height;
                    $('#mapDrag').width((Math.round(gridStand) * halw) * 2).height((Math.round(gridStand) * halh) * 2);
                });
            }
        });
    }
}

それを機能させるのは本当に簡単だと感じましたが、私はそれを機能させることができないようです。

これは、その中で行うことの基本を備えた jsFiddle です。ロード時にわかるように、div は適切なサイズにスケーリングされますが、ドロップダウンで別の部屋を選択してもサイズは変更されません。jsFiddle: http://jsfiddle.net/gujPK/

4

0 に答える 0