Question

我的功能如下：uiModal.simpleModal('<p>This is some content</p>');

应该使用传递的数据作为模态内容来调用模态。例如（注意我没有添加modalHtml，因为它与这个问题无关）。

simpleModal: function (data) {

    var responseHtml = data;

    // Append the modal HTML to the DOM
    var modalInstance = $('body').append(modalHtml);

    // Dynamically load in the passed data from the call
    $.ajax({
        timeout: 5000,
        success: function (responseHtml) {
            $(modalInstance).find('.uiModalContent').html($(responseHtml));
            $(modalInstance).find('.uiModalContent').removeClass('loading');

            isModalSuccess = true;
        },
        error: function () {
            $(modalInstance).find('.uiModalContent').html('<div class="message error"><h2>Unknown Error</h2> Please contact support</p></div>');
            $(modalInstance).find('.uiModalContent').removeClass('loading');
        }
    });

    $(modalInstance).find('.ModalClose').live('click', function (e) {
        e.preventDefault();
        $(this).parents('.uiModal').fadeOut(function () { $(this).parents('.uiModalWrapper').remove() });
    });
},

但是它没有加载数据！有人能指出我正确的方向

由于

Answer 1

看起来你没有告诉你的ajax方法从哪里加载数据。

您需要传入一个用于加载数据的网址：

$.ajax({
        url: "http://www.example.com/jsonRequest",
        timeout: 5000,
        success: function (responseHtml) {}
});

<强>更新

鉴于您的评论如下，您可能会对ajax的设计产生轻微的误解。

在您的情况下，您已经拥有模态窗口的数据，因此您可以在不需要ajax调用的情况下使用它。

    $(modalInstance).find('.uiModalContent').html($(responseHtml));
    $(modalInstance).find('.uiModalContent').removeClass('loading');

如果您还需要检查respoonseHtml变量中是否存在数据，那么您可以使用简单的if语句执行此操作：

if(responseHtml.length > 0)
{
        $(modalInstance).find('.uiModalContent').html($(responseHtml));
        $(modalInstance).find('.uiModalContent').removeClass('loading');
}
else
{
   $(modalInstance).find('.uiModalContent')
     .html('Error message here');
   $(modalInstance).find('.uiModalContent').removeClass('loading');

}

Answer 2

为什么我看不到ajax调用的任何URL。必须有一些你想要点击的网址，检索数据，如果不是，那你为什么要做$ .ajax？

使用jQuery AJAX加载传递的HTML

2 个答案: