jQuery.get()没有填充div

时间:2009-08-27 21:30:41

标签: javascript jquery

这个功能出了什么问题:

function() {
    $.get('/controller/action', function(data) {
        $('#temporaryPhotos').text(data);
    } );
    return false;
}

它应该做的是从 / controller / action 页面获取HTML并将HTML插入当前页面的#temporaryPhotos div。

初始标记如下所示:

<div id="temporaryPhotos"></div>

所以这只是一个空div。 jQuery函数应该用另一个页面填充照片(当然,它是相同的网站)。但是div保持空白。

编辑:

我想我的帖子不是很清楚,所以这里有一个额外的信息。我实际上要完成的是使用上述函数作为Uploadify jquery插件(http://www.uploadify.com)的回调。

以下是完整的JavaScript代码:

$(document).ready(function() {    
    $('#photo').uploadify({
        'uploader'       : '/flash-uploader/scripts/uploadify.swf',
        'script'         : '/flash-uploader/scripts/upload-public-photo.php',
        'cancelImg'      : '/flash-uploader/cancel.png',
        'scriptData'     : {'user_id' : 'USER_ID'},
        'queueID'        : 'fileQueue',
        'auto'           : true,
        'multi'          : true,
        'sizeLimit'      : 2097152,
        'fileExt'        : '*.jpg;*.jpeg;*.gif;*.png',
        'wmode'          : 'transparent',
        'onComplete'     : function() {
            $.get('/controller/action', function(data) {
                alert(data);
                $('#temporaryPhotos').html(data);
            } );
            return true;
        }
    });
});

我已尝试过text()和html(),还有alert()。仍然没有:(

EDIT2:

经过进一步研究,我发现Uploadify插件中的默认onComplete()函数如下所示:

jQuery(this).bind("uploadifyComplete", {'action': settings.onComplete}, function(event, ID, fileObj, response, data) {
    if (event.data.action(event, ID, fileObj, unescape(response), data) !== false) {
        jQuery("#" + jQuery(this).attr('id') + ID + " .percentage").text(' - Completed');
        jQuery("#" + jQuery(this).attr('id') + ID).fadeOut(250, function() { jQuery(this).remove()});
    }
});

我已经用自己的(我在这篇文章中的第一篇)重写了这个函数,这似乎是一个问题。

EDIT3:

页面的主要部分:

<script type="text/javascript" src="/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="/flash-uploader/scripts/swfobject.js"></script>
<script type="text/javascript" src="/flash-uploader/scripts/jquery.uploadify.v2.1.0.min.js"></script>
<script type="text/javascript">
    //<![CDATA[
$(document).ready(function() {    
    $('#photo').uploadify({
        'uploader'       : '/flash-uploader/scripts/uploadify.swf',
        'script'         : '/flash-uploader/scripts/upload-public-photo.php',
        'cancelImg'      : '/flash-uploader/cancel.png',
        'scriptData'     : {'user_id' : 1},
        'queueID'        : 'fileQueue',
        'auto'           : true,
        'multi'          : true,
        'sizeLimit'      : 2097152,
        'fileExt'        : '*.jpg;*.jpeg;*.gif;*.png',
        'wmode'          : 'transparent',
        'onComplete'     : function() {
            alert("hello");
        }
    });
});    //]]>
</script><script type="text/javascript" src="/js/document-ready.js"></script>

3 个答案:

答案 0 :(得分:6)

尝试使用html代替文字:

 $('#temporaryPhotos').html(data);

此外,您可能希望尝试提醒响应以查看从服务器返回的内容:

function() {
    $.get('/controller/action', function(data) {
        alert(data);
        $('#temporaryPhotos').html(data);
    });
    return false;
}

答案 1 :(得分:1)

.text(str)将str作为明文插入(转义标记)

$("p").text("<b>Some</b> new text.");

<b>Some</b> new text.

http://docs.jquery.com/Attributes/text#val

.html(str)将其插入为html。

答案 2 :(得分:1)

在firebug中设置断点,以确保您没有滥用Uploadify。