尽管刷新,jQuery格式仍未应用于Ajax数据 - javascript

我正在通过GET响应消息从服务器(php文件)的可折叠内部加载列表视图。但是,尽管刷新了jQuery元素,但jQuery格式并未应用于添加的HTML。

我的页面在这里:http://i.cs.hku.hk/~hsbashir/Project_Work/events/events.html

HTML代码(仅相关代码)

<script>
lastRecord=0;

    function loadEvents(){

        $('#sample').html( 'hello' );
        $.get(
        "eventquery.php?lastRecord="+lastRecord,
        function( data ) {
            $('#loadCollapsible').append( data )
            .listview( 'refresh' );
            }); 

    }
</script>
</head>
<body style="background-color : #e9e9e9;" onload="loadEvents()">

<div data-iconpos="none" data-role="collapsibleset" data-theme="a" data-content-theme="a">

<div data-role="collapsible" data-collapsed="false">
    <h2><img src="today_calendar.png" style="height: 60px; vertical-align:middle;"> Today's Events </h2>
    <div id="loadCollapsible">
    <!-- Load from php -->
    </div>
</div>  

PHP代码(仅相关代码)

    while ($row = mysql_fetch_array($result)){

        print '<div data-role="collapsible" data-collapsed="false">';

        print '<h5>'.$row['Title'].'<h5>';
        print ' <ul data-role="listview">';
        print '<li><a href="#">';
        print '<table><tr><td>Date</td>';
        print '<td style="padding: 10px;">'.$row['Date'].'</td>';
        print '</tr><tr>';
        print '<td> Time </td>';
        print '<td style="padding: 10px;">'.$row['Time_Duration'].'</td>';
        print '</tr><tr>';
        print '<td> Venue </td>';
        print '<td style="padding: 10px;">'.$row['Venue'].'</td>';
        print '</tr></table></a></li>';
        print '<li style="background-color: #CADECC;">';
        print '<button class="ui-btn ui-shadow ui-corner-all ui-btn-icon-left ui-icon-calendar" style="width: 170px; float: right; position: relative;">Add to calendar</button>';
        print '</li></ul>'; 

        print '</div>';
    }

参考方案

在调用refresh方法之前,必须首先初始化jQuery Mobile listview。

因为您要使用ajax加载列表,所以不会自动对其进行初始化。尝试这个:

function loadEvents(){

        $('#sample').html( 'hello' );
        $.get(
        "eventquery.php?lastRecord="+lastRecord,
        function( data ) {
            $('#loadCollapsible').append( data );
            $('#loadCollapsible ul').listview().listview( 'refresh' );
            }); 

    }

用jQuery填充模式形式 - javascript

我正在将订单表从数据库绘制到datatables(jquery插件)中。我要在每笔最后一笔交易或每笔交易中增加付款。问题是,如何获取单击添加付款按钮以添加付款的行的订单ID。其次,当点击addpayment时,它会弹出一个带有字段或订单号的模态表单。我想用在td中找到的订单ID填充该字段,并使其不可编辑或隐藏,但在提交模态表单时将其发布到服务器。表格和模式表…

JavaScript处理期间数组内部的数组 - javascript

我正在尝试使用Ajax处理表单,并且在处理复选框时遇到了问题。我以为我可以在数组中做一个数组,将选中的框添加到数据对象中,但这似乎不起作用。它不会显示为控制台中对象的一部分或类似内容。我尝试了一些变化,但没有任何效果。这是当前的样子:var formData = { 'fname' : $('input[name=fname]&…

将简单的javascript代码转换为c# - javascript

昨天我在这里问了一个问题。使用javascript和html解决方案很简单前一阵子我打算什么是操纵html来执行javascript中的任务但是我改变了主意,将javascript代码重写为c#这是输入<Abstract> <Heading>Abstract</Heading> <Para TextBreak=�…

如果复选框切换复选框已选中,则在切换div中输入必填字段 - javascript

我使用脚本用JavaScript切换了一些div。如果要选中复选框以显示toogle div,我想在toogle div中设置一些“必填”输入字段。有人能弄清楚吗?那是工作吗?function show(id) { if(document.getElementById) { var mydiv = document.getElementById(id); m…

在laravel中应用ajax - javascript

我想在laravel 4.2中应用ajax。我想重定向到页面而不重新加载它。我已经尝试过使用window.loaction.href和window.loaction.assign了,但是它不起作用。这是我的文件Route.php //login+logout+auth Route::get('login','authentica…