Question

关于jquery ajax请求的成功函数我正在用消息创建div ......但它似乎没有出现....

success: function(data) {
    $(function() {
        $('<div id="alert">Successfully Updated</div>');

        var $alert = $('#alert');

        if ($alert.length) {
            var alerttimer = window.setTimeout(function() {
                $alert.trigger('click');
            }, 3000);

            $alert.animate({ height: $alert.css('line-height') || '50px' }, 200).click(function() {
                window.clearTimeout(alerttimer);
                $alert.animate({ height: '0' }, 200);
            });
        }
    });

的CSS：

#alert
  {
   overflow: hidden;
   width: 100%;
   text-align: center;
   position: absolute;
   top: 0;
   left: 0;
   background-color: #FF0000;
   height: 0;
   color: #FFFFFF;
   font: 20px/40px arial, sans-serif;
   opacity: .9;
  }

Answer 1

您需要将新created element追加到 DOM树。

jQuery（更好地说Sizzle）无法查询。像这样扩展您的代码：

 $('<div id="alert">Successfully Updated</div>').appendTo(document.body);

另外，您应该使用class代替id。如果有多个警报怎么办？您将创建具有相同ID的多个div，这是一个很大的 nono 。

Answer 2

您必须将新创建的元素插入DOM。然后只会出现。您可以将元素附加到body或容器元素。

还有一部分代码令人困惑，超时功能和触发div的click事件。

同样.length将返回一个数字而不是布尔值。而且在成功函数中也不需要文档就绪事件处理程序。

Answer 3

您可以将div放在DOM中并使用css display: hidded，然后在成功响应中，您可以更改display: block这样div将包含在DOM中，您只需切换有点。

Jquery ajax成功函数显示消息

3 个答案: