Question

我遇到了由AJAX返回的Jquery移动弹出式HTML代码的问题。我需要这个用于我正在做的移动应用程序，它调用一个从mysql数据库获取文本和图像链接的php页面（这些将永远在变化）。

我的代码基于这个jfiddle：http://jsfiddle.net/wbfqy/

这是与AJAX返回时相同的代码：http://jsfiddle.net/NF2jz/4392/

$.ajax({
    url: '/echo/html/',
    data: {
        html: '<div data-role="content"><a href="#TEST_about" data-role="button" data-rel="popup">Popup</a><div data-role="popup" id="TEST_about" data-theme="d" ><a href="#" data-rel="back" data-role="button" data-theme="d" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a><img src="http://www.illinoisci.com/files/cellphone.gif" width="157" height="88" class="popphoto" /></div></div>'
    },
    type: 'POST',
    success: function(msg)
    {       document.getElementById("target").innerHTML=msg;
    }              
});

有解决方法吗？

感谢。

Answer 1

上面的data密钥是您要发送到PHP脚本的数据。

因此，要在之后插入弹出窗口，您可以按如下方式添加它。请注意，您现在没有发送任何特定内容或使用收到的msg参数执行任何操作：

$.ajax({
    url: '/echo/html/',
    data: {
        someParam1: 'someValue1',
        someParam2: 'someValue2',
    }
    type: 'POST',
    success: function (msg) {
        popupHTML = '<div data-role="content"><a href="#TEST_about" data-role="button" data-rel="popup">Popup</a><div data-role="popup" id="TEST_about" data-theme="d" ><a href="#" data-rel="back" data-role="button" data-theme="d" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a><img src="http://www.illinoisci.com/files/cellphone.gif" width="157" height="88" class="popphoto" /></div></div>';
        //insert the  popupHTML into the target
        $('#target').HTML(popupHTML);
        // then trigger the create event to make jQM markup the insert html properly and attach the correct events etc.
        $('#target').triggert('create');
    }
});

更多信息：

jQuery Ajax

jQM trigger

Answer 2

谢谢Rob我不知道触发功能。我使用以下代码：

$.ajax({
    url: '/echo/html/',
    data: {
        html: '<div data-role="content"><a href="#TEST_about" data-role="button" data-rel="popup">Popup</a><div data-role="popup" id="TEST_about" data-theme="d" ><a href="#" data-rel="back" data-role="button" data-theme="d" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a><img src="http://www.illinoisci.com/files/cellphone.gif" width="157" height="88" class="popphoto" /></div></div>'
    },
    type: 'POST',
    success: function(msg)
    {       
     $('#target').html(msg);
     $('#target').trigger('create');
    }              
});

使用AJAX返回时，JQuery移动弹出窗口无法正常工作

2 个答案: