jquery-mobile - ライトスイッチのフリップスイッチが無限ループに入る

Question

Flipswitch をレンダリングして、lightswitch アプリケーションのカスタム コントロールとして使用するためのコードを取得しました。

function createBooleanSwitch(element, contentItem, trueText, falseText, optionalWidth) {
var $defaultWidth = '5.4em';
var $defaultFalseText = 'False';
var $defaultTrueText = 'False';
var $selectElement = $('<select data-role="slider"></select>').appendTo($(element));

if (falseText != null) {
    $('<option value="false">' + falseText + '</option>').appendTo($selectElement);
}
else {
    $('<option value="false">' + $defaultFalseText + '</option>').appendTo($selectElement);
}

if (trueText != null) {
    $('<option value="true">' + trueText + '</option>').appendTo($selectElement);
}
else {
    $('<option value="true">' + $defaultTrueText + '</option>').appendTo($selectElement);
}


// Now, after jQueryMobile has had a chance to process the 
//     new DOM addition, perform our own post-processing:
$(element).one('slideinit', function () {
    var $flipSwitch = $('select', $(element));

    // Set the initial value (using helper function below):
    setFlipSwitchValue(contentItem.value);

    // If the content item changes (perhaps due to another control being
    //     bound to the same content item, or if a change occurs programmatically), 
    //     update the visual representation of the control:
    contentItem.dataBind('value', setFlipSwitchValue);

    // Conversely, whenver the user adjusts the flip-switch visually,
    //     update the underlying content item:
    $flipSwitch.change(function () {
        contentItem.value = ($flipSwitch.val() === 'true');
    });

    // To set the width of the slider to something different than the default,
    //    need to adjust the *generated* div that gets created right next to
    //    the original select element.  DOM Explorer (F12 tools) is a big help here.
    if (optionalWidth != null) {
        $('.ui-slider-switch', $(element)).css('width', optionalWidth);
    }
    else {
        $('.ui-slider-switch', $(element)).css('width', defaultWidth);
    }

    //===============================================================//

    // Helper function to set the value of the flip-switch
    //     (used both during initialization, and for data-binding)
    function setFlipSwitchValue(value) {
        $flipSwitch.val((value) ? 'true' : 'false');

        // Having updated the DOM value, refresh the visual representation as well
        //  (required for a slider control, as per jQueryMobile's documentation)
        $flipSwitch.slider(); // Initializes the slider

        $flipSwitch.slider('refresh');

        // Because the flip switch has no concept of a "null" value
        //    (or anything other than true/false), ensure that the 
        //    contentItem's value is in sync with the visual representation
        contentItem.value = ($flipSwitch.val() === 'true');
    }
});

}

このコードは正常に動作します。画面にフリップスイッチをレンダリングします。ポップアップに表示される編集画面にデータを表示しています。フリップスイッチを含むポップアップを開くと問題が発生し、UI のデータを変更せずに、そのポップアップ画面を閉じようとします。IE がハングし、長いスクリプトが実行されているというエラーが表示されます。createBoolenaSwitch 関数をデバッグすると、setFlipSwitchValue(value){} という関数内で無限ループになっていることがわかりました。

なぜこの関数が呼び出され、これが無限ループに入るのですか?