0

これが、起こっているはずのことです。ユーザーがボタンをクリックするたびに、div のテキストが変化します。私はこれを完全に機能させました(ここでの以前の質問のおかげです)。クリックするたびに、ランダムなテキストを含む Cookie が生成され、それが div に表示されます。いっぱいになる 5 つの div (Cookie ごとに 1 つ) があり、最初の div は (6 回目のクリックで) 上書きされます。私が言ったように、これは完璧に機能しています。

ただし、誰かが初めてクリックすると、最初の div にはテキストが正しく表示されますが、他の 4 つの div には「未定義」が表示されます (他の Cookie がまだ定義されていないため)。これはコードに基づいて予想されると思います。ただし、これらの div のコンテンツが「未定義」の場合、div は非表示のままにしたいと思います。

div のコードは次のとおりです。

<div id="textDiv" class="div"></div>
<div id="textDiv1" class="div1"></div>
<div id="textDiv2" class="div2"></div>
<div id="textDiv3" class="div3"></div>
<div id="textDiv4" class="div4"></div>

各 div に入力するコードは次のとおりです (ただし、5 つの Cookie と 5 つの div すべてをカバーするために 5 回繰り返されます...すべてを省略してスペースを節約します。

<script>
$(document).ready(function(){
$("form").click(function () {
var div = document.getElementById("textDiv");
div.textContent = $.cookie('cookie_1');
var text = div.textContent;
})
}); 
</script>

<script>
$(document).ready(function(){
$("form").click(function () {
var div = document.getElementById("textDiv1");
div.textContent = $.cookie('cookie_2');
var text = div.textContent;
})
}); 
</script>

ETC...

私が言ったように、これはうまくいきますが、クッキーがすべて設定される前に div は「未定義」と表示されます。私はこれを試しました:

<script>
$(document).ready(function(){
$("form").click(function () {
var $cook1 = $.cookie('cookie_1');
var $cook2 = $.cookie('cookie_2');
var $cook3 = $.cookie('cookie_3');
var $cook4 = $.cookie('cookie_4');
var $cook0 = $.cookie('cookie_0');
})
}); 
</script>

<script>
$(document).ready(function(){
$("form").click(function () {
if(typeof cook2 == 'undefined'){
    $('textDiv1').hide();
    }
else {
     var div = document.getElementById("textDiv1");
div.textContent = $.cookie('cookie_2');
var text = div.textContent; 
}
})
}); 
</script>

ETC...

Cookie(したがって、div内のテキスト)が未定義の場合、これはdivを非表示にします。唯一の問題は、Cookie が定義されると (フォームをもう一度クリックした後)、再表示されないことです。定義されているかどうかを「再チェック」していないようです。Cookie が変更されると div 内のテキストが変更されるため、クリックするたびに Cookie をチェックしているように見えるので、これは私には奇妙です。

これを行う方法はありますか?

(そして、はい、コードを複雑にしすぎて、単純化する方法がたくさんあると仮定していますが、私はこれが初めてなので、すべての提案を受け入れます。)

(注:Cookieを生成するためのコードは省略しましたが、これは正常に機能し、答えには当てはまらないと思います。)

ありがとう!

4

1 に答える 1

1

これはより簡単で、うまくいくはずです:

div.textContent = $.cookie('cookie_1') || "";

また、コードには多くの繰り返しが見られます。次のように単純化できます。

<script>
$(document).ready(function(){

    function fillDiv(divId, cookieId) {
        var div = document.getElementById(divId);
        div.textContent = $.cookie(cookieId) || "";
    }

    $("form").click(function () {
        fillDiv("textDiv", "cookie_1");
        fillDiv("textDiv1", "cookie_2");
        // etc.
    })
}); 
</script>
于 2013-08-26T00:42:15.000 に答える