disable div id after its click_问答_开发者_运维开发者技术经验分享

开发者 https://www.devze.com 2023-02-18 03:03 出处：网络

相关专题：jquery

         <style type="text/css">
      #thebutton { width: 100px; background-color: #eee; text-align: center;      
                 padding: 10px; cursor: pointer; }              
       #thebutton.activated    { font-weight: bold;}
       #thebutton.hovering     { color: Blue; }

 #thebox { background-color: #eee; position:relative; width: 300px; height: 200px; 
               padding: 10px; top: 5px; display: none;}
        </style>

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

    $("#thebutton").click(function () {
         var currentValue ;


    $.ajax({

        type:       "post",
        url:        "checklikes",

        //data:           "user="+name.val(),
        success:    function(msg)
                    {
                      $("#replies").html(msg)
            .fadeIn("fast");
                         currentValue=parseInt(msg)+1;

                        $("#test").html(currentValue)
            .fadeIn("fast");
                             var data1= $("#test").text();


              $.ajax({

        type:       "post",
        url:        "checkupdate",

        data:           "user="+data1,
        success:    function(msg)
                    {
                      $("#t").html(msg)
            .fadeIn("fast");
                             $("#thebutton").toggleClass("activated");
            $("#thebutton").hasClass("activated") ? $("#thebox").fadeIn():
                 $("#thebox").fadeOut();                  

           $(this).attr('disabled','disabled');

                    }




    });
                    }




    });
        });
        });
    <body>
    <div id="thebutton">Click me!</div&g开发者_如何学Ct;
    <div id="thebox" style="display:none;">Content goes here</div>  
     </body>

after click of thebutton I want to disable it,but it is not working.

Instead of

$("#thebutton").click(function () {

try

$("#thebutton").one("click", function () {

Few things in the code I've spotted for instance when you set the attr('disabled') you are trying to do it to a class of .button instead of the id #button. And can you actually use the ? : syntax within javascript?

Either way there is a working example for you here

In your callback use jQuery UI's own internal method to handle disabling the button which will change its decoration.

$('#thebutton').click(function () {
    $('#thebutton')
           .toggleClass('activated')
           .button('disable')
           .button('refresh');   // sometimes necessary
});