2

連絡先フォームの表示を切り替えることができる JavaScript 関数があります。フォームが送信された後、フォームを開いたままにしておきたい。送信後にページがリロードされたときにフォームを表示するようにスクリプトに指示する Cookie を作成する方法はありますか。

HTML

<a href="#" onClick="toggle_visibility('toggle');">Contact</a>

CSS

#toggle{
    display:none;
}

JS

function toggle_visibility(id) {
    var e = document.getElementById(id);
    if(e.style.display == 'block'){
        e.style.display = 'none';
    }else{
        e.style.display = 'block';
    }
}
4

2 に答える 2

2

使用しているサーバー側のテクノロジーを /ThePage?toggle=1 にリダイレクトし、次のようなものを使用して URL パラメーターを読み取ることができます。

function onload() {
    var toggle = getUrlParams()["toggle"];
    if (toggle == "1") toggle_visibility('toggle');
}

function getUrlParams() {
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}
于 2012-05-13T19:13:14.353 に答える
1

ローカルの JavaScript を使用してすべての状態を Cookie に保存できます (サーバーは関与しません)。

function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
}

function toggle_visibility(id, cookieName) {
   var e = document.getElementById(id);
   var visible;
   if(e.style.display == 'block') {
      e.style.display = 'none';
      visible = false;
   } else {
      e.style.display = 'block';
      visible = true;
   }
   if (cookieName) {
       createCookie(cookieName, visible, 1);
   }
}

次に、ページが読み込まれると、DOM が読み込まれた後にこの関数を呼び出すことで、以前の状態を復元できます。

function restore_visibility(id, cookieName) {
    var visibility = readCookie(cookieName);
    if (visibility == null) return;    // no cookie
    var e = document.getElementById(id);
    if (visibility) {
        e.style.display = 'block';
    } else {
        e.style.display = 'none';
    }
}

"contactFormVisible"cookieName のような文字列を使用できます。

于 2012-05-13T19:16:53.847 に答える