0

jQuery UIを使用して再利用可能なボックスを作成し、値をテキストボックスに渡します。値はCMまたはインチのいずれかです。

私が抱えている問題は、unit_typeボックスからセンチメートルを選択した後にサイズをドラッグすると、インチに戻ります。ロジックを再考し、すべてを再マップする必要があると思います。

誰かがこれを手伝ってくれる？

コードは...

$(function()
{
    $("#resizable").resizable({
        aspectRatio: 16 / 9,
        maxWidth:  $("#max_width").val(),
        maxHeight: $("#max_height").val(),
        resize: function() {

            var widthInch = $("#resizable").width() / 200;
            var heightInch = $("#resizable").height() / 200;

            $("#unit_type").change(function()
            {
                var widthCM = $("#resizable").width() / 200 * 2.54;
                var heightCM = $("#resizable").height() / 200 * 2.54;

                $(".width").val(widthCM + '' + ' CM');
                $(".height").val(heightCM + '' + ' CM');
            })

            var widthCM = $("#resziable").width() / 200 * 2.54;
            var heightCM = $("#resizable").height() / 200 * 2.54;

            $(".width").val(widthInch + '' + ' Inches');
            $(".height").val(heightInch + '' + ' Inches');
        }
    });
})

ありがとう

4

1 に答える 1

1

問題は、サイズを計算する場所にあります。最善の解決策は、これを新しい関数に引き出し、ボックスのサイズが変更されたとき、または単位が変更されたときにその関数を呼び出すことです。このようなものが機能するはずです。（私がいくつかの仮定をしたので、おそらくあなたはあなたの正確なマークアップに合うようにそれを修正するでしょう。）

$(function()
{
    $("#resizable").resizable({
        aspectRatio: 16 / 9,
        maxWidth:  $("#max_width").val(),
        maxHeight: $("#max_height").val(),
        resize: updateSize
    });
})

$("#unit_type").change(updateSize);

function updateSize() {
   unit = $("#unit_type").val();
   if(unit == "in") {
            var widthInch = $("#resizable").width() / 200;
            var heightInch = $("#resizable").height() / 200;

            $(".width").val(widthInch + '' + ' Inches');
            $(".height").val(heightInch + '' + ' Inches');
   } else if(unit == "cm") {
            var widthCM = $("#resizable").width() / 200 * 2.54;
            var heightCM = $("#resizable").height() / 200 * 2.54;

            $(".width").val(widthCM + '' + ' CM');
            $(".height").val(heightCM + '' + ' CM');
   }
}
于 2012-06-12T15:57:32.287 に答える