Question

我在jquery mobile

中使用了popup()

$("#id").popup();

我想在弹出窗口打开时向'id'元素添加一些数据..怎么样？

Answer 1

将此添加到您的JavaScript：

$("#id").on('popupafteropen', function(){
    // do whatever here
    $(this).append("Add some HTML!");
    $(this).html("Or replace the HTML contents.");
});

查看弹出式插件的事件：http://jquerymobile.com/test/docs/pages/popup/events.html

Answer 2

$('#id').attr('data-some', 'some').popup();

或

$('#id').data('some', 'some').popup();

关于 data()

Answer 3

所以，使用jQuery mobile，如果你通过ajax调用生成链接，总会有问题。这是因为在init上，jQuery mobile往往会改变很多关于元素的东西。

此外，你不能继续生成多个弹出窗口，因为如果你正在开发像我这样的项目，你可能会有很多你需要弹出窗口的地方，使应用程序变慢。因此，每当有人点击链接时，我们只制作一个弹出窗口并更改内容。

我创造了一个小提琴，看着你的问题。试一试，欢呼声

http://jsfiddle.net/tanwaniniranjan/0hzco633/3/

HTML：

<a href="#popupBasic" data-rel="popup" data-transition="flip" class="popupcontentchanger">Open Popup</a>

<div data-role="popup" id="popupBasic" data-overlay-theme="a">
    <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
    <div id="changehere"> <!-- We will be changing content in this div -->

    </div>
</div>

jQuery的：

//script to change content
$(document).on("click",".popupcontentchanger",function(event){
    var newhtml = $(this).html();
    $(document).on("popupafteropen", "#popupBasic", function (e) {
        $("#popupBasic #changehere").html(newhtml);
    });
});

//script to clear current html in the popup, on closing of popup so that every time it opens, it loads new content, without initially showing the old content. would have been better if jquery mobile added another method: popupbeforeopen :P
$(document).on("popupafterclose", "#popupBasic", function (e) {
    $("#popupBasic #changehere").html('');
});

如何在jquery mobile中添加动态数据到弹出窗口？

3 个答案: