我一直在失去我的活动,我怎样才能让他们保持联系

时间:2011-09-29 19:58:35

标签: jquery

我的页面部分会弹出一个小屏幕。这个屏幕上有两个按钮。当按下这些按钮中的任何一个时,屏幕被移除。但是屏幕可能需要在以后重复使用,所以不是总是重建屏幕而是将其存储在页面上对象的数据中。当存储的屏幕重新加载正常时,所有事件似乎都丢失了,因为第二次屏幕出现时按钮没有做任何事情。我该如何解决这个问题?

function AddScreen() {
    var store= $('#store'), screen;
    if(objectStoringScreen.length > 0){
        screen = objectStoringScreen.data('screen');
    }else {
        store = CreateStore(); //Create Store
        $(this).parent().append(store); //Add Store
        screen = Screen(); // Create Screen
    }

    PushScreen(screen); //Load selected screen

    function Screen() {
        //build div
        // build two buttons and place them in the div
        // btn1.click(onOK); btn2.click(onCancel);
    }

    function onOK() {
        store.data('screen',screen); 
        PopScreen();
    }
    function onCancel() {
        PopScreen(); 
    }
}

1 个答案:

答案 0 :(得分:0)

我会事先创建屏幕并在需要时切换它。

<div id="screen">
    Screen Div
    <input type="button" value="OK" /> <input type="button" value="Cancel" />
</div>
<div id="showScreen">click here to show the screen</div>

    $(document).ready(function () {
        // Screen already exists, just hide it.  If you need to build it from data on the page, do it after it's hidden.
        $('#screen').hide();

        // Some action that shows/hides your screen, I just used a click method as an example
        $('#showScreen').click(function () {
            if ($('#screen').css('display') == 'none') {
                // Or you can build here if you need it to be updated in real time for whatever reason
                //   ex.  $('#screen').append('<input type="button" id="someSpecialButton" value="Special Button" />');
                $('#screen').show();
            }
            else {
                $('#screen').hide();
            }
        });

        // Screen button events, will still exist after hiding the screen
        $('#screen input[type="button"]').click(function () {
            alert('You clicked ' + $(this).attr('value') + ' on the screen');
        });
    });