PHP pengaturcaraan untuk telefon bimbit dan tablet dengan JQuery telefon

Bayangkan anda menggunakan PHP untuk membangunkan aplikasi anda untuk dijalankan pada peranti mudah alih. Dengan JQuery mudah alih anda membuat antara muka yang berinteraksi dengan pelayan web melalui AJAX.


Pembentangan

Ia bukan sihir! Apa yang anda lakukan adalah yang biasa: kami menggunakan HTML untuk melancarkan skrin dan JavaScript (Ajax) untuk membuat permintaan kepada pelayan web, di mana kod sumber PHP yang akan menerima, Memproses dan memulangkan maklumat. Dan untuk ini, kita boleh bergantung pada set kemudahan yang JQuery membolehkan kita untuk.

JQuery Mobile

jQuery Mobile adalah satu rangka kerja web yang dioptimumkan untuk telefon pintar dan tablet. Ia adalah sistem antara muka berasaskan HTML5 yang serasi dengan platform mudah alih yang paling popular. Dibina di atas jQuery dan UI jQuery, Kod anda membolehkan reka bentuk yang fleksibel, Mudah disesuaikan.

Dalam amalan

Mari kita buat contoh mudah, di mana kita mempunyai antara muka dengan medan teks untuk pengguna memasukkan “Nama”. Dengan mengklik pada “Menghantar”, Borang dihantar ke pelayan (melalui AJAX), yang memaparkan mesej “Hi nameDoUsuario!” atau “helo dunia!”, Jika medan nama kosong.

helo dunia!

Index. php | Antaramuka pengguna (pihak pelanggan)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<?PHP
<!DOCTYPE HTML>
<HTML>
    <Ketua>
    <Tajuk>helo dunia! JQuery Mobile</Tajuk>
    <nama Meta="viewport" Kandungan="width=device-width, awal-skala = 1"> 
    <Pautan Rel="stylesheet" Href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
    <MPP script="http://code.jquery.com/jquery-1.6.4.min.js"></skrip>
    <MPP script="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></skrip>   
    <skrip>
        $(fungsi() { 
            $("#bt-enviar").Klik(fungsi() {
                $.Ajax({
                  Jenis: "POST",
                  Url: "http://taylorlopes.com/util/jquerymobile/olamundo/olamundo.php",
                  Tarikh: ({Nama: $.Trim($("#nome").Val()) }),
                  dataType: "text",
                  Kejayaan: fungsi(Tarikh) {
                    $("#nome").Val("");
                    $("#resultado").HTML(Tarikh);
                  }
                });
            });
        });
    </skrip>     
</Ketua>
<badan> 
    <data DIV-Peranan="page" ID="indexPage">
        <data DIV-Peranan="header">
            <H1>Olá mundo - JQuery Mobile</H1>
        </Bhg.>
        <data DIV-Peranan="content">
            <data DIV-Peranan="fieldcontain">
                <Label adalah="nome">Informe Seu:</Label>
                <jenis input="text" ID="nome" nama="nome" nilai="" />
            </Bhg.>
            <ID input="bt-enviar" Jenis="button" nilai="Enviar" />
            <id Bhg.="resultado"></Bhg.>
        </Bhg.>
    </Bhg.> 
</badan>
</HTML>
?>
olamundo. php | Kod PHP anda (bahagian pelayan)
1
2
3
 
  <?PHP pengepala("Content-Type: teks/html;  CharSet = ISO-8859-1",benar-benar) ?>
  <H3>Hello <?PHP echo $_ JAWATAN[nama] ? $_ JAWATAN[nama] : "Mundo" ?>!</H3>

Hasilnya adalah sesuatu seperti:


Lihat Kod ini berfungsi!

Balkoni besar JQuery Mobile adalah di Meta-tag “Kaedah”, di mana parameter “lebar = lebar peranti” secara automatik menghalang kandungan bergantung pada skrin peranti mudah alih yang anda mengakses. Dengan cara ini,, Pembentangan apabila mencapai desktop adalah berbeza daripada telefon mudah alih.

Anda boleh menggunakan Pelagak untuk lebih menggambarkan cara halaman anda berkelakuan dan muncul pada telefon mudah alih, Tablet, dan lain-lain, seperti yang dilihat dalam Rajah di atas. Dalam kes Chrome, Hanya pasang sambungan jenis “Ripple emulator” dan gunakannya sebagai alat ujian. Terdapat beberapa penyelesaian yang serupa.

Selebihnya pergi dari keperluan dan kreativiti anda…

Jumlah hits: 64871

11 Komen terakhir “PHP pengaturcaraan untuk telefon bimbit dan tablet dengan JQuery telefon

  1. Fabio berkata:

    selamat pagi, Tahniah kerana jawatan. Saya ingin mengambil kesempatan daripada kandungannya untuk bertanya soalan(Jika anda boleh membantu saya, Saya bersyukur). Saya ingin membuat pertanyaan mudah di Bank dalam PHP dan kemudian menunjukkan pada skrin pengguna berdaftar atau tidak di Bank menggunakan jQuery mudah alih. Anda tahu bagaimana saya boleh berbuat demikian.? Bersyukur atas perhatian.

    • Hello Fabio. Ya, tahu bagaimana untuk melakukannya, tetapi anda perlu tahu pengaturcaraan sedikit supaya anda memahami penjelasan. Prinsip ini sama seperti yang saya gunakan dalam contoh “olamundo. php”; perbezaannya ialah anda perlu membuat sambungan ke pangkalan data, mendapatkan hasil yang diingini (membina SQL anda) dan memaparkannya. Pelukan!

      • Max berkata:

        Hello Taylor, anda akan mempunyai kursus penuh pengaturcaraan PHP untuk telefon bimbit dan tablet dengan JQuery Mobile. Taip CRUD yang.

        Satu contoh sistem Jadual Kursus di mana saya dapat melihat senarai kursus yang datang dari pangkalan data dan dengan mengklik pada kursus saya dapat melihat semua maklumat kursus.

      • Hi Max. Saya tidak mempunyai kursus ini :( Contoh dalam post ini sudah sangat hampir dengan apa yang anda perlukan, anda hanya perlu bekerja Permintaan (menghantar borang/data/html melalui Ajax) dan yang Respons (data kembali diproses pelayan/php/sql). Di internet terdapat banyak contoh CRUD dalam PHP.

        Hari ini jika anda melakukan sesuatu untuk mudah alih, akan menggunakan Ionik.

    • Kod adalah berasaskan HTML, CSS dan JavaScript. Jadi, pelayar itu sendiri (Ie, Firefox, Chrome) dari peranti anda (telefon bimbit, Tablet, Notebook) menguruskan pentafsiran. Tiada perisian yang diperlukan. Pada pihak pelanggan, Masukkan kod dalam sebarang fail teks (Notepad, sebagai contoh) dan simpannya sebagai lanjutan. html. Pada sisi pelayan, untuk memanipulasi data, perlu menggunakan bahasa pengaturcaraan, seperti PHP, Java, Asp, .Bersih, dan lain-lain.

  2. Rafael Augusto berkata:

    selamat tengah hari,

    Pertama, Tahniah pada artikel.

    Kemudian ia adalah mungkin untuk membangunkan aplikasi untuk kedua-dua Android dan iOS menggunakan jQuery Mobile dan Phonegap dan juga dan mungkin untuk menggunakan PHP dan MYSQL untuk menyambung kepada pelayan?

    • selamat malam, Ya ia sempurna mungkin. Dengan Phonegap anda membuat permohonan anda dalam HTML/JS (pihak pelanggan) dan ia akan dijalankan pada Android iOS, mencapai sumber bahagian pelayan (PHP dan MySQL), melalui AJAX.

  3. Jan berkata:

    Ia sebagai contoh program yang anda lakukan telah dipasang di Google Play ? atau hanya roda, mengakses secara langsung dalam pelayar ?

    • Ya, anda membuat permohonan anda dengan HTML, CSS dan JavaScript dan kemudian menggunakan program seperti Fonegap untuk menjana permohonan (Hampir) asli ke platform seperti Android dan iOS. Kemudian hanya muat naik ke Google Play (Android). Permohonan anda akan dapat berkomunikasi dengan PHP anda biasanya dengan membuat permintaan Ajax, seperti dalam contoh.

tinggalkan balasan

Ini alamat e-mel anda tidak akan disiarkan. Medan yang diperlukan akan ditandakan dengan *