1

昨日からデモサイトを利用していて、自分のサイトでバージョンを作っています。

デモサイトは次のとおりです:http: //rikrikrik.com/jquery/autosave/

これが私のサイトにある正確なコードです:http: //jsfiddle.net/EswfB/1/

問題:関連するCookieの削除が正しく機能していません。

動作する場合と動作しない場合があります。通常は、クリックして更新し、[復元]をクリックして、もう一度[削除]をクリックした場合にのみ機能します。

さて、デモサイトと私のサイトは昨日完全に機能していました。私のマシンの電源を切り、今日戻って、どちらも機能しませんでした。同僚のマシンでも作業しないでください。

ChromeとFFを使用します。

何か案は?

[関連するCookieを削除]をクリックしても、アドレスバーにhref = "#"の兆候は表示されません。また、関連するCookieを削除しても何も起こりません。

4

1 に答える 1

2

管理が簡単な JavaScript で localStorage を使用することをお勧めします。多くのコードを節約できます。http://jsfiddle.net/EswfB/8/

function save() {
    var firstname = document.profileForm.First_name.value;
    var lastname = document.profileForm.Last_name.value;
    if(document.getElementById("GenderMale").checked) {
        var gender = "Male";
    }
    else if(document.getElementById("GenderFemale").checked) {
        var gender = "Female";
    }
    var howdowecontactyou = document.profileForm.How_do_we_contact_you.value;
    var preferredtimeofcontact = document.profileForm.Preferred_time_of_contact.value;
    var jobtitle = document.profileForm.Job_title.value;
    localStorage.setItem("firstname", firstname);
    localStorage.setItem("lastname", lastname);
    localStorage.setItem("gender", gender);
    localStorage.setItem("howdowecontactyou", howdowecontactyou);
    localStorage.setItem("preferredtimeofcontact", preferredtimeofcontact);
    localStorage.setItem("jobtitle", jobtitle);
    document.getElementById("autosave_saving").innerHTML = "Saved!";
}
function load() {
    var firstname =  localStorage.getItem("firstname");
    var lastname =  localStorage.getItem("lastname");
    var gender =  localStorage.getItem("gender");
    var howdowecontactyou =  localStorage.getItem("howdowecontactyou");
    var preferredtimeofcontact =  localStorage.getItem("preferredtimeofcontact");
    var jobtitle =  localStorage.getItem("jobtitle");
    document.profileForm.First_name.value = firstname;
    document.profileForm.Last_name.value = lastname;
    if(gender == "Male") {
        document.getElementById("GenderMale").checked = true;
        document.getElementById("GenderFemale").checked = false;
    }
    if(gender == "Female") {
        document.getElementById("GenderMale").checked = false;
        document.getElementById("GenderFemale").checked = true;
    }
    document.profileForm.How_do_we_contact_you.value = howdowecontactyou;
    document.profileForm.Preferred_time_of_contact.value = preferredtimeofcontact
    document.profileForm.Job_title.value = jobtitle;
}
function deleteStorage() {
    localStorage.removeItem("firstname");
    localStorage.removeItem("lastname");
    localStorage.removeItem("gender");
    localStorage.removeItem("howdowecontactyou");
    localStorage.removeItem("preferredtimeofcontact");
    localStorage.removeItem("jobtitle");
}
​

そしてHTML:

<p><button class="autosave" OnClick="save()">Save form</button> <button class="autosave_restore" OnClick="load()">Restore form</button> <input type="RESET" value="Default Form"> <button OnClick="deleteStorage()" class="autosave_removecookies">Delete related cookies</button> <span class="autosave_saving" id="autosave_saving"></span></p>
<!-- Licensed software, from www.freecontactform.com -->
<form name="profileForm" accept-charset="utf-8" method="post" action="forms/simple_form/_process.php" onSubmit="return validate.check(this)">
<table class="widthOneHundredPercent">
<tr>
<td class="tableCellFloat widthFortyPercent" valign="top">
<label for="First_name" class="required">First name<span class="required_star"> * </span></label>
</td>
<td class="tableCellFloat" valign="top">
<input type="text" name="First_name" id="First_name" maxlength="50" value="" placeholder="First name"/>
</td>
</tr>
<tr>
<td class="tableCellFloat widthFortyPercent" valign="top">
<label for="Last_name" class="required">Last name<span class="required_star"> * </span></label>
</td>
<td class="tableCellFloat" valign="top">
<input type="text" name="Last_name" id="Last_name" maxlength="50" value="" placeholder="Last name"/>
</td>
</tr>
<tr>
<td class="tableCellFloat columnOne" valign="top">
<label for="Gender">Gender</label></td>
</td>
<td class="tableCellFloat columnTwo" valign="top">
<input type="radio" name="Gender" value="Male" id="GenderMale" />Male<br />
<input type="radio" name="Gender" value="Female" id="GenderFemale" />Female<br />
</td>
</tr>
<tr>
<td class="tableCellFloat widthFortyPercent" valign="top">
<label for="How_do_we_contact_you?" class="required">How do we contact you?<span class="required_star"> * </span></label>
</td>
<td class="tableCellFloat" valign="top">
<select class="tableCellFloat" id="How_do_we_contact_you" name="How_do_we_contact_you">
<option value="">Please select...</option>
<option value="Email">Email</option>
<option value="Phone">Phone</option>
<option value="Text">Text</option>
</select>
</td>
</tr>
<tr>
<td class="tableCellFloat widthFortyPercent" valign="top">
<label for="Preferred_time_of_contact">Preferred time of contact?</label>
</td>
<td class="tableCellFloat" valign="top">
<select class="tableCellFloat" id="Preferred_time_of_contact" name="Preferred_time_of_contact">
<option value="">Please select...</option>
<option value="08:00_-_12:00">08:00 - 12:00</option>
<option value="12:00_-_17:30">12:00 - 17:30</option>
<option value="17:30_-_20:00">17:30 - 20:00</option>
<option value="Anytime">Anytime</option>
</select>
</td>
</tr>
<tr>
<td class="tableCellFloat widthFortyPercent" valign="top">
<label for="Job_title">Job title</label>
</td>
<td class="tableCellFloat" valign="top">
<input type="text" name="Job_title" id="Job_title" maxlength="50" value="" placeholder="Job title"/>
</td>
</tr>
</table>    
<div class="clearboth">&nbsp;</div>
<center><input type="SUBMIT" value="submit"></center>
</form>​
于 2012-04-11T11:02:19.817 に答える