私のクライアントは、オンラインで製品を表示するサイトを望んでいますが、e コマース サイトは、所有する製品の数が非常に少ないため、望んでいませんでした。
ユーザーがクリックすると Cookie に保存されるボタンを各製品に作成したいと考えています。私が思いついたのは、ページ内に非表示のテキストエリアを作成し、ユーザーが各製品の注文ボタンをクリックすると、テキストエリアに追加され、同時に Cookie に保存されるということです。次に、ユーザーが注文ページに移動すると、注文がテキストエリアに読み込まれます。
オンラインのページで見つけたJavaScriptの部分。以下は私のコードです。
<div id="hide" style="display: none;">
<textarea id="myContent2" name="myContent2"></textarea>
<a onClick="addContent('myDiv2', document.getElementById('myContent2').value); setCookie('content', document.getElementById('myContent2').value, 7);">
<br><br>
<div id="myDiv2" style="font-weight: bold;"></div>
</div>
<script type="text/javascript">
function addContent(divName, content) {
document.getElementById(divName).innerHTML = content;
}
</script>
<script type="text/javascript">
function setCookie(c_name,value,expiredays) {
var exdate=new Date();
exdate.setDate(exdate.getDate()+expiredays);
document.cookie=c_name+ "=" +escape(value)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
}
function getCookie(c_name) {
if (document.cookie.length>0) {
c_start=document.cookie.indexOf(c_name + "=");
if (c_start!=-1) {
c_start=c_start + c_name.length+1;
c_end=document.cookie.indexOf(";",c_start);
if (c_end==-1) c_end=document.cookie.length;
var cookieContent = "Welcome back " + unescape(document.cookie.substring(c_start,c_end));
document.getElementById('myDiv2').innerHTML = cookieContent;
}
}
}
getCookie('content');
</script>
これは、ユーザーが製品ページで注文ボタンをクリックした場所です
<a onClick="addContent('myDiv2', document.myContent2.append("Product No 1") ); setCookie('content', document.getElementById('myContent2').value, 7);">
問題は、ユーザーがボタンをクリックしても、テキストエリアに何も送信されず、同時に Cookie が更新されないことです。これを修正するにはどうすればよいですか。また、ユーザーが注文ボタンをクリックするたびに、テキストエリアを消去するのではなく、新しいデータをテキストエリアに追加するようにするにはどうすればよいですか。