-1

大家好,我很少坚持如何id<li>标签上绑定值

我的阿贾克斯

//AJAX MENGAMBIL KATEGORI SEKOLAH
$.getJSON('http://localhost/aplikasi/assets/www/include/kategori.php', function(data) {
    console.log(data); //Untuk melihat data yang berhasil diambil di firebugs
    results = data.items; //Menampung array ke dalam variabel results

    //menggunakan fungsi each untuk membuat elemen list, sesuai banyaknya array
    $.each(results, function (index, kategori) {
        var html;

        //Membuat element list untuk setiap kategori
        html = '<li id="klik" data-katid="';
        html += kategori.kat_id;
        html += '"><a id="klik2" data-transition="slide" href="#list" OnClick="carisekolah()">';
        html += kategori.kat_nama; 
        html += '</a></li>';

        //Memasukkan ke dalam unordered list        
        $('#kategorisekolah').append(html);
    });

    //Refresh list
    $('#kategorisekolah').listview('refresh');

    //Memberikan fungsi ke setiap element 
    $("#listsekolah").children("li").bind("click", function (e) {
        carisekolah($(this).attr("data-katid"));
    });

});

function carisekolah(id) {
    $.getJSON('http://localhost/aplikasi/assets/www/include/list.php?id=' + id, function(data) {
        console.log(data); //Untuk melihat data yang berhasil diambil di firebugs
        results = data.items; //Menampung array ke dalam variabel results
        $('#listsekolah').empty();
        //menggunakan fungsi each untuk membuat elemen list, sesuai banyaknya array
        $.each(results, function (index, sekolah) {
            var html;

            //Membuat element list untuk setiap sekolah
            html = '<li data-sekid="' + sekolah.content_id + '">';
            html += '<h2>' + sekolah.content_nama + '</h2>'; 
            html += '<p>' + sekolah.content_alamat + '</p>'; 
            html += '<p> Telepon : ' + sekolah.content_telepon + '</p>'; 
            html += '</li>';


            //Memasukkan ke dalam unordered list        
            $('#listsekolah').append(html);
        });

        //Refresh list
        $('#listsekolah').listview('refresh');

    });
}

我的 HTML

<body>
<div data-role="page" id="home">
    <div data-role="header">
        <h1>Aplikasi Pencarian Sekolah</h1>
    </div>

    <div data-role="content">
        <p> Selamat datang di aplikasi pencarian sekolah..<br /><br />
            Silahkan memilih kota..
        </p>
        <a href="#kategori" data-role="button" data-inset="true"> JABODETABEK </a>
    </div>
</div>
<div data-role="page" id="kategori">
    <div data-role="header">
        <h1>Aplikasi Pencarian Sekolah</h1>
    </div>

    <div data-role="content">
        <ul id="kategorisekolah" data-role="listview" data-inset="true"></ul>
    </div>
</div>

<div data-role="page" id="list" data-add-back-btn="true" data-back-btn-text="Kembali">
    <div data-role="header">
        <h1>List Sekolah</h1>
    </div>

    <div data-role="content">
        <!-- Format list Jquery Mobile menggunakan fitur 'Pencarian' -->
        <ul id="listsekolah" data-role="listview" data-filter="true" data-filter-placeholder="Cari sekolah..." data-inset="true"></ul>
    </div>
</div>

</body>

我用静态 id 测试过,它可以工作

$.getJSON('http://localhost/aplikasi/assets/www/include/list.php?id=1'

我的函数 carisekolah(id) 与获取该参数 id 完全失败,我怎样才能以正确的方式获取参数 id?

4

2 回答 2

0

似乎您正在<li>准备好在 DOM 上绑定列表,但是在您的 HTML 标记中,您的列表没有子级。如果这些是动态添加的,那么您应该使用事件委托。试试这个:

$(document).on('click', '#listsekolah li', function() {
    carisekolah(this.id);
});

如果 ID 实际上来自data-katid属性,请像这样调用函数:

carisekolah($(this).data("katid"));
于 2013-06-06T14:43:01.057 回答
0

很难理解你的问题。但听起来你想做这样的事情:

$("li").on("click", function(event){ 
    var id = $(this).attr("id");
    carisekolah(id);
});
于 2013-06-06T14:36:47.640 回答