javascript - .on ("pagecreate") 没有被调用

标签 javascript jquery

我正在尝试复制此代码:http://jsfiddle.net/ezanker/5qe6g/1/

我正在使用 goolge blogger

我已经在模板 html 中导入了

<head>
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
    <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js' type='text/javascript'/> 
    <script src='http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js' type='text/javascript'/> 
    <script src='http://code.jquery.com/jquery-1.9.1.min.js' type='text/javascript'/>
    <script src='http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css' type='text/javascript'/>
    <script type="text/javascript" src="/resources/scripts/jquery-1.9.1.min.js"></script>  
    <script type="text/javascript" src="/resources/scripts/app.ui-1.0.js"></script>     
    <script type="text/javascript" src="/resources/scripts/jquery.mobile-1.3.0.min.js"></script> 

问题是“onpagecreate”没有被调用。如果我像这样摆脱它:

function createList(menudata){
    var html = '';
    $.each(menudata,function(i,val){
        html += '<div data-role="collapsible" data-inset="true" data-id='+val.productId+'><h3>'+val.name+'</h3><ul data-role="listview" data-inset="true">';
        $.each(val.productoption,function(i,val){
            html += '<li class="row">'+val.topping+'</li>';
        });
        html += '</ul></div>';
    });
    return html;
}

    var menulistitem = createList(data);
    $('#menu-content').empty().append(menulistitem);
    $('div[data-role=collapsible]').collapsible();
    $('div ul').listview();

它绘制菜单,但不可折叠。我假设它不可折叠的原因是时机已关闭

有人知道如何解决这个问题吗?

谢谢!

最佳答案

问题出在 html 文件的 head 标记中。首先,您不需要多次加载相同的文件。问题是您将 jquery.mobile-1.4.5.min.css CSS 文件放在 script 标记中。 CSS 文件需要包含在链接标记中:

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">

清除一些不必要的 jquery 加载后,您的 head 标签从外部资源只需要这个:

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

查看工作代码:codePen

关于javascript - .on ("pagecreate") 没有被调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40537227/

相关文章:

javascript - 如何使应用程序中的所有按钮(甚至是动态创建的)都遵循 jquery 按钮小部件,而无需多次调用 .button()

javascript - 图像在多图像 slider 中显示两次

Jquery - 将选定的行值传递到隐藏文本框

javascript - 与麦哲伦一起展开和折叠滚动的 Foundation 6 Accordion 菜单

jquery if else 语句 hasClass addClass click

javascript - 手动刷新页面时如何取消浏览器关闭/刷新确认模式?

javascript - 单击/触摸外部 javascript 时关闭菜单

javascript - XMLHttpRequest 到 jQuery Ajax

javascript - 在自定义 js 上传递给 getElementById() 的空字符串

javascript - 每 x 毫秒增加一个元素中数字的值