簡體   English   中英

如何將用戶返回到使用當前代碼的特定div

[英]How can I return user to a specific div working with current code

我有一份包含12個部門的表格問卷。 第一個div是顯示塊,其他div顯示無。 然后在點擊時顯示和隱藏div的標簽功能。 最后一個div是對ajax調用加載的表單的回顧。 下面的代碼工作正常,我想添加一個按鈕,以便用戶可以返回並回答未解答的問題

這段代碼工作正常 ** $(document).ready(function(){var tab_pool = [“Q1”,“Q2”,“Q3”,“Q4”,“Q5”,“Q6”,“Q7”,“Q8”,“ Q9“,”Q10“,”Q11“,”Q12“]; var visible = $(”。tab:visible“)。attr('class')。split(”“)[1]; var curr_ind = $。 inArray(visible,tab_pool);

        $('.next').click(function () {
             $("#processing").show();
                $.ajax({
                    type: "POST",
                    url: "process.php",
                    data: $('.data').serialize() + "&data=" + data,
                    success: function (data, status, xhr) {
                        if (xhr.getResponseHeader("DB_SUCCESS") == 1) {
                 $("#processing").hide();
                        } else {
                 $("#processing").hide();
                            alert("Save failed");
                return false;
                        }
                    }
                });
    // There are conditions here such as if this then
    //  curr_ind = curr_ind + whatever to move to next relevant question 
        if (curr_ind < 11) {
            $(".tab:visible").delay(750).hide(0);
         $("#processing").delay(750).hide(0);
            curr_ind = curr_ind + 1;
            $("." + tab_pool[curr_ind]).delay(750).show(0);
            $(".finished").delay(750).hide(0);
            $(".back").delay(750).show(0);
        }
    // if the user has reached the end then below we show the review of questionaire
        if (curr_ind === 11) {
         $("#processing").delay(750).hide(0);
            $(".finished").delay(750).show(0);
            $.ajax({ 
              type: "POST",
              url: 'review.php',
            data:  "username=" + username,
            success: function (data, status, xhr) {
             if (xhr.getResponseHeader("DB_SUCCESS") == 1) {
             $("#review").show();
                $('#review').html(data);
              } else {
                alert("Review not available");
                return false;
                }
            }
            });
             }
        });
    // after the first question a back button is display for
    //  user to go back to previous question
        $('.back').click(function () {
            if (curr_ind > 0) {
                $(".tab:visible").hide();
    // There ar conditions here so user is brought back to 
    // the right div and not one that was skipped from conditions above     
                $("." + tab_pool[curr_ind]).show();
        document.getElementById(tab_pool[curr_ind]).checked=false;
                $(".finished").hide();
                $(".next").show();
            }
            if (curr_ind === 0) {
                $(".back").hide();
            }
        });

結束工作代碼**

// **** what I want here is a button for unanswered questions that will bring user
// back to that specific unaswered question
// I tried assigning a class and a numeric value to those buttons but
// for some reason I get a new blank page??? 
// I tried a few variations of the code below 
        function answerQ (value) {
        var returnTo = value;
            curr_ind = curr_ind - returnTo;
                $(".tab:visible").hide();
                $("." + tab_pool[curr_ind]).show();
        document.getElementById(tab_pool[curr_ind]).checked=false;
                $(".finished").hide();
                $(".back").hide();
                $(".next").show();
        }
    });

* *回到未回答問題的按鈕樣本

回答

最簡單的可能是設置一個cookie。

另一種選擇是設置localStorage或sessionStorage(如果你可以指望它們擁有現代瀏覽器)。

關於這個主題的一些閱讀:
http://net.tutsplus.com/tutorials/html-css-techniques/quick-tip-learning-about-html5-local-storage/ http://www.sitepoint.com/html5-web-storage/
https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage

您需要記住他們查看表單的次數。 您沒有提到PHP,但是您將其作為標記,因此我假設您正在使用它。 您可以創建一個會話變量來存儲用戶查看頁面/表單的次數。 (這個偽代碼寫得很晚,沒有經過測試,但你應該能夠獲得它的主旨)

if (!isset($_SESSION['viewCnt']))
    $_SESSION['viewCnt'] = 1;
else { //not the first time viewing the page/form, so increment counter and setup ajax
    $_SESSION['viewCnt'] = $_SESSION['viewCnt']+1;
    echo'
    <script>
        $(function() {
            //do your ajax call here to fill div6
        });
    </script>
    ';
}

echo'
<div id="1" style="display:'.($_SESSION["viewCnt"] == 1 ? 'block' : 'none').';"></div>
<div id="2" style="display:none;"></div>
<div id="3" style="display:none;"></div>
<div id="4" style="display:none;"></div>
<div id="5" style="display:none;"></div>
<div id="6" style="display:'.($_SESSION["viewCnt"] == 1 ? 'none' : 'block').';"></div>
';

如果您不想使用會話變量,那么您可以使用cookie或HTML5網絡存儲: http//www.w3schools.com/html/html5_webstorage.asp

注意:會話方法將重新開始,每次新的登錄應用程序,cookie方法將根據其過期日期或用戶清除其臨時Internet文件時重新開始

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM