Question

嘿伙计这是我的改变功能

<select name="select-native-1" id="namakota" data-native-menu="false">
        <option value="-1" selected="selected" disabled="disabled" >City</option>
        <option value="surabaya">Surabaya</option>
        <option value="jakarta">Jakarta</option>
    </select>

这是我的div和onchange函数

       <ul class="rig columns-2" id="daftaracara" data-filter="true" data-filter-placeholder="Cari Acara">

        </ul>
        $(document).on('change', '#pilihkota', function () {
            //event.preventDefault();
            var kota = $(this).val();
            //alert(kota);
                $.ajax({
                url: host+'/skripsi3/phpmobile/asd.php',
                data: { "id": user,"kota": kota},
                dataType: 'json',
                success: function(data, status){

                    $.each(data, function(i,item){

                    if(item.kosong=="tidak")
                    {

                        if(item.cekfol=="ya")
                        {

                                $('#daftaracara').append('<li><img id="gambar" onclick="detailAcara('+item.idacara+')" onclick="detailAcara('+item.idacara+')" src="web/uploads/'+item.gambar+'" alt=""><h2>'+item.nama+'</h2>'+'<p style="font-size:18px; color:#333366;">'+item.tanggal+'</p><p style="font-size:14px; color:#00F;">Lokasi : '+item.lokasi+'</p><p style="font-size:14px; color:#F00;">Pemesanan : '+item.pesan+'</p><a data-role="button" class="following green followButton" style="background: green; color: white;" onclick="simpanacara('+item.idacara+')">Following</a></li>').trigger("create");    

                        }
                        else if(item.cekfol=="tidak")
                        {

                                $('#daftaracara').append('<li><img id="gambar" onclick="detailAcara('+item.idacara+')" onclick="detailAcara('+item.idacara+')" src="web/uploads/'+item.gambar+'" alt=""><h2>'+item.nama+'</h2>'+'<p style="font-size:18px; color:#333366;">'+item.tanggal+'</p><p style="font-size:14px; color:#00F;">Lokasi : '+item.lokasi+'</p><p style="font-size:14px; color:#F00;">Pemesanan : '+item.pesan+'</p><a data-role="button" class="follow ui-btn-b followButton" data-theme="b" onclick="simpanacara('+item.idacara+')">Follow</a></li>').trigger("create");     

                        }
                        $("#daftaracara").show();
                    }
                    else if(item.kosong=="ya")
                    {
                        $("#daftaracara").hide();
                    }

                    });

                },
                error: function(ts){
                    alert(ts.responseText);
                }
            });
        });

在＆＃34; surabaya＆＃34;有2个结果数据和＆＃34; jakarta＆＃34;有1个结果数据。首先，当我选择＆＃34; surabaya＆＃34;结果很好，只显示2个数据，但是当我选择＆＃34; jakarta＆＃34;之后＆＃34; surabaya＆＃34;结果显示3个数据，这是来自＆＃34; surabaya＆＃34;的2个数据。来自＆＃34; jakarta＆＃34;的1个数据。当我从我的PHP检查它的工作正常。我的目标是ajax结果可以显示正确的结果。也许有人可以告诉我我的代码有什么问题。我对这件事真的很新手。谢谢你们，祝你们度过愉快的一天！

Answer 1

使用空清除以前的值：

success: function(data, status){
                    $('#daftaracara').empty();//here clear the previous values
                    $.each(data, function(i,item){

                    if(item.kosong=="tidak")
                    {

                        if(item.cekfol=="ya")
                        {

                                $('#daftaracara').append('<li><img id="gambar" onclick="detailAcara('+item.idacara+')" onclick="detailAcara('+item.idacara+')" src="web/uploads/'+item.gambar+'" alt=""><h2>'+item.nama+'</h2>'+'<p style="font-size:18px; color:#333366;">'+item.tanggal+'</p><p style="font-size:14px; color:#00F;">Lokasi : '+item.lokasi+'</p><p style="font-size:14px; color:#F00;">Pemesanan : '+item.pesan+'</p><a data-role="button" class="following green followButton" style="background: green; color: white;" onclick="simpanacara('+item.idacara+')">Following</a></li>').trigger("create");    

                        }
                        else if(item.cekfol=="tidak")
                        {

                                $('#daftaracara').append('<li><img id="gambar" onclick="detailAcara('+item.idacara+')" onclick="detailAcara('+item.idacara+')" src="web/uploads/'+item.gambar+'" alt=""><h2>'+item.nama+'</h2>'+'<p style="font-size:18px; color:#333366;">'+item.tanggal+'</p><p style="font-size:14px; color:#00F;">Lokasi : '+item.lokasi+'</p><p style="font-size:14px; color:#F00;">Pemesanan : '+item.pesan+'</p><a data-role="button" class="follow ui-btn-b followButton" data-theme="b" onclick="simpanacara('+item.idacara+')">Follow</a></li>').trigger("create");     

                        }
                        $("#daftaracara").show();
                    }
                    else if(item.kosong=="ya")
                    {
                        $("#daftaracara").hide();
                    }

                    });

                },

Answer 2

由于您正在使用$.append()函数结果，因此将结果添加到'#daftaracara' div结果中。请在每个ajax请求之前将div清空。它将清除该div中的所有先前数据。

在结果的开头使用$('#daftaracara').empty()。即在行之后

success: function(data, status){
$('#daftaracara').empty(); 
then rest your code;

使用ajax onchange函数显示数据

2 个答案: