Rumah  >  Artikel  >  hujung hadapan web  >  javascript memanggil kaedah jsp

javascript memanggil kaedah jsp

WBOY
WBOYasal
2023-05-10 09:24:06919semak imbas

Dengan pembangunan berterusan pembangunan Web, teknologi bahagian hadapan telah menjadi bahagian yang amat diperlukan dalam pembangunan Web, dan Javascript, sebagai bahasa yang paling penting, memainkan peranan penting dalam aplikasi Web moden. Sebaliknya, JSP, sebagai teknologi yang digunakan secara meluas dalam Java EE, juga merupakan bahagian penting dalam pembangunan aplikasi Web moden. Artikel ini terutamanya akan memperkenalkan cara memanggil kaedah JSP dalam Javascript untuk mencapai pembangunan aplikasi web yang lebih fleksibel.

1. Mengapakah anda perlu memanggil kaedah JSP dalam Javascript

Dalam sesetengah aplikasi web yang kompleks, logik interaksi bahagian hadapan adalah sangat kompleks dan mungkin dijana secara dinamik berdasarkan pengguna yang berbeza? operasi. Elemen yang dijana secara dinamik ini perlu memanggil perkhidmatan back-end untuk mendapatkan data atau melaksanakan operasi lain. Dalam kes ini, jika bahagian hadapan hanya memanggil antara muka bahagian belakang melalui Ajax untuk melaksanakan fungsi, maka antara muka ini perlu dipratakrifkan dan didedahkan untuk bahagian hadapan untuk memanggil, yang akan mengehadkan fleksibiliti dan skalabiliti permohonan. Dan jika bahagian hadapan boleh terus memanggil kaedah dalam JSP hujung belakang, maka bahagian hadapan boleh mengatur kod dengan lebih bebas, dan boleh nyahpepijat serta membangunkan dengan lebih mudah.

2. Cara memanggil kaedah JSP dalam Javascript

1. Pelaksanaan melalui Ajax

Dalam Javascript, kita boleh memanggil antara muka belakang melalui Ajax untuk mencapai interaksi Backend. Pada bahagian belakang, kita boleh menentukan kaedah yang sepadan dalam JSP dan mendedahkannya dalam Servlet. Kaedah ini agak mudah dan mudah untuk dilaksanakan, tetapi ia memerlukan penentuan antara muka secara manual dan melaksanakan operasi yang sepadan pada bahagian belakang.

2. Pelaksanaan melalui JavaBean

Dalam JSP, kami boleh mentakrifkan model data tertentu melalui JavaBean dan mengakses model data ini melalui Jsp:usebean di bahagian hadapan. Dalam Javascript, anda boleh mendapatkan sifat dalam JavaBean melalui Jsp:getProperty. Kaedah ini berdasarkan JavaBean dan perlu mentakrifkan model data dalam JSP Ia lebih fleksibel, tetapi ia perlu mengakses data melalui Jsp:getProperty pada bahagian hadapan.

3. Dilaksanakan melalui perpustakaan teg tersuai

Dalam JSP, kami boleh menggunakan pustaka teg tersuai untuk mentakrifkan beberapa teg tersuai, supaya bahagian hadapan boleh memanggil hujung belakang Java dengan mudah kod. Dalam Javascript, anda boleh memanggil kaedah dalam JSP dengan memanggil teg tersuai ini. Kaedah ini memerlukan anda melaksanakan sendiri pustaka teg tersuai, yang agak rumit, tetapi ia membolehkan anda mentakrifkan teg yang anda perlukan dengan lebih fleksibel.

3. Contoh Analisis

Seterusnya, kami akan memberikan contoh kecil untuk menggambarkan kaedah pelaksanaan khusus untuk memanggil kaedah JSP dalam Javascript. Katakan kita perlu melaksanakan borang dinamik yang perlu dikemas kini secara dinamik selepas pengguna memilih pilihan yang berbeza. Kita boleh menggunakan kod berikut untuk mentakrifkan JavaBeans dalam JSP:

<%@ page import="java.util.*" %>
<jsp:useBean id="tableData" class="com.xxx.xxx.xxx.TableData" scope="request" />

<%
    List<Object> data = new ArrayList<Object>();
    data.add(new String[] {"Row 1, Column 1", "Row 1, Column 2", "Row 1, Column 3"});
    data.add(new String[] {"Row 2, Column 1", "Row 2, Column 2", "Row 2, Column 3"});
    data.add(new String[] {"Row 3, Column 1", "Row 3, Column 2", "Row 3, Column 3"});
    tableData.setData(data);
%>

Pada masa yang sama, dalam JSP, kita boleh mentakrifkan teg tersuai berikut untuk mencapai pengemaskinian dinamik jadual:

<%@ taglib prefix="table" uri="/WEB-INF/tags/table.tld" %>

<table:dataTable id="table" header="Column 1,Column 2,Column 3" rows="${tableData.data}" />
<select id="select">
    <option value="0">Select All</option>
    <option value="1">Select Row 1</option>
    <option value="2">Select Row 2</option>
    <option value="3">Select Row 3</option>
</select>

<script>
    $('#select').on('change', function() {
        var row = this.value;
        $.ajax({
            url: '/updateTable',
            data: {row: row},
            dataType: 'json',
            success: function(data) {
                $('#table tbody').html('');
                for (var i = 0; i < data.length; i++) {
                    var row = data[i];
                    var tr = '<tr>';
                    for (var j = 0; j < row.length; j++) {
                        var td = '<td>' + row[j] + '</td>';
                        tr += td;
                    }
                    tr += '</tr>';
                    $('#table tbody').append(tr);
                }
            }
        });
    });
</script>

Di sini , kami mentakrifkan Label tersuai "table:dataTable" dicipta untuk memaparkan kandungan jadual. Pada masa yang sama, dalam skrip JS, kami menggunakan Ajax untuk memanggil antara muka belakang "/updateTable" untuk mendapatkan data jadual yang diubah. Di bahagian belakang, kami boleh menerima permintaan ini melalui Servlet dan mengubah suai JavaBean yang ditakrifkan dalam JSP mengikut parameter dalam permintaan (di sini ialah "baris"). Kemudian, dalam nilai pulangan fungsi, kami boleh menghantar data yang diubah suai ke bahagian hadapan untuk mencapai kesan mengemas kini jadual secara dinamik.

Setakat ini, kami telah memperkenalkan pelaksanaan cara memanggil kaedah JSP dalam Javascript. Sama ada melalui Ajax, JavaBean atau perpustakaan teg tersuai, kami boleh memanggil perkhidmatan bahagian belakang dengan mudah di bahagian hadapan dan mencapai pembangunan aplikasi web yang lebih fleksibel. Sudah tentu, dalam aplikasi praktikal, kita perlu memilih dan menggunakannya mengikut keperluan tertentu.

Atas ialah kandungan terperinci javascript memanggil kaedah jsp. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn