Question

$(document).ready(function(){
 var zone; //ZONE TO PASS THROUGH HTTP POST
 var NEcount; //COUNTER HOW MUCH NOT-EDITBALE ZONES USER MUST CONFIGURE 
 NEcount = 5; //IF I NEED 20(ZONES = CELLS OF MAP) USER MUST CONFIGURE 25-20=5 NOT EDITABLE ZONE FOR EXAMPLE(I'LL TAKE THIS VALUE FROM HTML CONTENT AND CALCULATED WITH JSP/JAVA) 

    $('body div#presentation div#map a').click(function(){
        zone = $(this).attr('href');
        zone = zone.substr(5);//i generate html code with jsp/java function href is like ="#area1"
    });

    $('body div#presentation div#map a p').click
    (
        function()
        {
            if($(this).attr('class') === "white")
            {
                $.post("MSservlet", {postsend:"updateMap",attrib:"editable",elem:"0",cond:zone});//Servlet call a PreparedStatement Query that update editable field to 0 where zone field is equal to var zone
                    NEcount--;
                    $(this).attr('class','gray');
                    if(NEcount <= 0)
                    {
                        $('#NEobb').html("HTML BUTTON THAT LINK TO END CONFIGURATION PAGE");

                    }
                    else
                    $('#NEobb').text("count = "+NEcount);
                }
            else if($(this).attr('class') === "gray")
                {
                $.post("MSservlet", {postsend:"updateMap",attrib:"editable",elem:"1",cond:zone});
                    NEcount++;
                    $(this).attr('class','white');
                    if(NEconta <= 0)
                    {
                        $('#NEobb').html("HTML BUTTON IMHO"); //LINK TO END CONFIGURATION OF MAP                            
                    }
                    else
                    $('#NEobb').text("count = "+NEcount);
                }
        }
);

});

我对这些jQuery帖子有疑问。

我有一个来自配置页面的交互式地图（简单的）产品。配置页面问我需要多少区域。使用表单字段，通过我传递给servlet的这个数字，web应用程序生成一个带有地图的新页面（用Bean的Matrix表示），如下所示：

(Map areas is like <a href="#areaNUMBERGENERATED"><p class="color"></p></a>)

jQuery p颜色正常变化但是第一篇文章没有工作（第一次点击）因为通过一个空区域（我不知道为什么）。

对于每次点击后我都有这种情况（我是意大利语并且很难解释）：

我点击了area1：首先发送zone = null到servlet（DB拒绝更新），颜色从白色变为灰色
重新点击的区域1：第二个发送区域= 1（更新通常在DB上运行，颜色再次变为白色）
我再次点击了area1：第三个帖子正常工作区域= 1并在DB上将可编辑设置为0
我点击了区域2：发送区域= 1（通过以前的区域（我确定））
我点击了区域3：发送区域= 2（这就是问题）
我再次点击区域3：发送区域= 2并正常更新应该是
我再次点击了area3：post send zone = 2并且正常更新应该是。

我该如何解决？请让我知道为什么也不起作用。

感谢您的建议。

意大利学生。

更新帖子：

我在同一个对象上有2个点击功能。

因此，当我点击地图区域/区域时，帖子无法及时获取var区域（可能）。

或者

在var zone set之前执行了帖子（抱歉我的英语不好）

我还没有解决方案。

建议？

Answer 1

非常感谢。

我刚编写了一个有效的解决方案。

说明：我删除了second.click（）动作块（包含帖子），因为在设置var zone变量的函数之前已经执行了._

所以我移动了if / else if block on first .click（）动作代码。

在html中，我有这样的N-Zones：

<!--grigio = gray and bianco = white(italian translation) -->
<div id="map">
<a href="#area1"><p class="grigio"></p></a>
<a href="#area2"><p class="grigio"></p></a>
<a href="#area3"><p class="grigio"></p></a>
<a href="#area4"><p class="grigio"></p></a>
<a href="#area5"><p class="grigio"></p></a>
<br>
<a href="#area6"><p class="grigio"></p></a>
<a href="#area7"><p class="grigio"></p></a>
<a href="#area8"><p class="grigio"></p></a>
<a href="#area9"><p class="grigio"></p></a>
<a href="#area10"><p class="grigio"></p></a>
<br>
<a href="#area11"><p class="grigio"></p></a>
<a href="#area12"><p class="grigio"></p></a>
<a href="#area13"><p class="grigio"></p></a>
<a href="#area14"><p class="bianco"></p></a>
<a href="#area15"><p class="bianco"></p></a>
<br>
<a href="#area16"><p class="bianco"></p></a>
<a href="#area17"><p class="bianco"></p></a>
<a href="#area18"><p class="bianco"></p></a>
<a href="#area19"><p class="bianco"></p></a>
<a href="#area20"><p class="bianco"></p></a>
<br>
<a href="#area21"><p class="bianco"></p></a>
<a href="#area22"><p class="bianco"></p></a>
<a href="#area23"><p class="bianco"></p></a>
<a href="#area24"><p class="bianco"></p></a>
<a href="#area25"><p class="bianco"></p></a>
<br>

</div>

FOR选择单击对象的内部我使用$（this）.children（'p'）。attr（'class'）

$(document).ready(function(){
     var zone; //ZONA DA PASSARE ATTRAVERSO HTTP POST
     var NEcount; //NON EDITABILI OBBLIGATORI DA INSERIRE
     NEcount = 5; // INIZIALIZZARE CALCOLANDO LE NE DA INSERIRE SE 21 = 4;

  $('body div#presentation div#map a').click(function(){
                    zone = $(this).attr('href');
            zone = zone.substr(5);

            if($(this).children('p').attr('class') === "white")//I added children for select p of the clicked object
                    {
                    $.post("MSservlet", {postsend:"updateMap",attrib:"editabile",elem:"0",cond:zone});
                        NEcount--;
                        $(this).children('p').attr('class','gray');//I added .children('p') to select class attr and change color
                        if(NEcount <= 0)
                        {
                            $('#NEobb').html("HTML BOTTON THAT LINK TO THE END OF CONFIGURATION");

                        }
                        else
                        $('#NEobb').text("counter = "+NEcount);
                    }
                else if($(this).children('p').attr('class') === "gray")//Same read comments up
                    {
                    $.post("MSservlet", {postsend:"updateMap",attrib:"editabile",elem:"1",cond:zone});
                        NEcount++;
                        $(this).children('p').attr('class','white');
                        if(NEcount <= 0)
                        {
                            $('#NEobb').html("HTML BUTTON THAT LINK TO END OF CONFIGURATION JUST IN CASE COUNT IS EQUAL 0"); //bottone che reindirizza alla pagina di fine configurazione.

                        }
                        else
                        $('#NEobb').text("counter = "+NEcount);
                    }

        });

});

我希望这有助于某人。

jQuery：当我第一次和第一次点击

1 个答案: