Question

$(document).ready(function () {
    $("#currentProject").click(function () {
        $("#projects").animate({
            height: "toggle"
        }, 800, function () {
            // Animation complete.
            $.get("<?php  echo base_url('async/projects'); ?>", function (data) {
                //alert(data[0].name);
                $("#projects").empty();
                $('#projects').append("<ul id='newList'></ul>");
                $.each(data, function (key, value) {
                    //alert(value.name);
                    $("#newList").append("<li><a style='text-decoration:none' href='<?php echo base_url();      ?>dashboard/index/" + value.cId + "'>" + value.name + "</a></li>");
                });
            }, "json");
        });
    });
});

以上代码完全符合我的要求。唯一的问题是它开始在第二次点击工作。当我第一次点击#currentProject时没有任何反应，它会从第二次点击开始运作。

Answer 1

在没有$（document）.ready

的情况下将js代码写在文档的末尾

Answer 2

$(document).ready(function () {
  $('#projects').hide();
  $("#currentProject").click(function () {
    $("#projects").animate({
        height: "toggle"
    }, 800, function () {
        // Animation complete.
        $.get("<?php  echo base_url('async/projects'); ?>", function (data) {
            //alert(data[0].name);
            $("#projects").empty();
            $('#projects').append("<ul id='newList'></ul>");
            $.each(data, function (key, value) {
                //alert(value.name);
                $("#newList").append("<li><a style='text-decoration:none' href='<?php echo base_url();      ?>dashboard/index/" + value.cId + "'>" + value.name + "</a></li>");
            });
        }, "json");
    });
  });
});

http://fiddle.jshell.net/29MdL/1/

Answer 3

每当我遇到这个问题时，这些解决方案对我有用，尝试使用on或live，具体取决于您使用哪一个版本

 $(document).on('click', '#currentProject', function() {        

    });

 $( "#currentProject" ).on( "click", function() {

  });

  $( "#currentProject" ).live( "click", function() {

 });

Jquery动画功能在第二次点击时触发

3 个答案: