Question

I wrote this simple code to understand why if I click the "click me" text for the second time JQuery does not display the "second" text.

<div id="clickme">Click me</div>
<div id="sometext">This is text ZERO</div>

<script type="text/javascript"> 
    $(document).ready(function($) {

        $("#clickme").click(function(){ 
            if (a == 1) {
                $( #sometext ).replaceWith( <div id="sometext">This is text TWO</div> );
            }
            else {
                $( #sometext ).replaceWith( <div id="sometext">This is text ONE</div> );
                var a = 1;
            }
        });

    });
</script>

我期望以下行为:

Page is loaded and the text This is text ZERO is displayed
I click the link the first time and JQuery displays This is text ONE
I click the link a second time and jQuery displays This is text TWO

相反,第3点没有处理,或者至少没有显示案文。为什么?

Answer 1

It is a scope issue as mentioned above, the variable a must be defined in the scope of the page, not the click event.

$(document).ready(function($) {
    var a = 0;

    $("#clickme").click(function() {
        if (a == 1) {
            $( #sometext ).replaceWith( <div id="sometext">This is text TWO</div> );
            a = 0;
        }
        else {
            $( #sometext ).replaceWith( <div id="sometext">This is text ONE</div> );
            a = 1;
        }
    });
});

http://jsfiddle.net/d5xSH/

Answer 2

Because a is defined locally, it is a scope issue. Initialize a globally and it will work. See Below

$(document).ready(function($) {
   var a = 0;
   $("#clickme").click(function(){ 
     if (a == 1) {
       $( #sometext ).replaceWith( <div id="sometext">This is text TWO</div> );
     }
     else {
       $( #sometext ).replaceWith( <div id="sometext">This is text ONE</div> );
       a = 1;
     }
   });
});

这里是一个dle

rel=“nofollow”>http://jsfiddle.net/jfhartsock/Khp7P/1/

友情链接