Question

我正在使用JSP和Servlets创建一个投注站点。

我需要创建一个可选择的投注系数表。它看起来像：

enter image description here

场景是：

用户按下系数并进行可能包含不同匹配的投注。我需要制作具有系数可选择的单元格，并且只允许连续选择一个。然后我应该得到所有被选中的系数并将它们放入请求中并在我的servlet中用它们做一些事情。

我可以使用JSP，Servlets和HTML执行此操作吗？或者我需要一些JavaScript代码？我对javascript几乎一无所知，所以一些链接或小代码清单对我有很大帮助。

提前致谢

Answer 1

您必须执行以下两项操作：1。将您的表格ID设置为表格 2。在每一行声明 onclick ='choose（n）;'，其中 n 的顺序为从1开始的行;如果你知道JSP希望你知道怎么做n 按行递增;

付费注意我正在设置 trLength ，从 rows.length 中减去1，仅当桌上有标题时。所以无论如何必须有标题，否则代码将无效

 <!DOCTYPE html>
 <html>
 <body onkeydown="chooseNext(event);">

    <table id="table">

        <th>name</th>
        <th>lastname</th>
        <th>score</th>
        <tr onclick="choose(1);">
            <td>Jill</td>
            <td>Smith</td>
            <td>50</td>
        </tr>
        <tr onclick="choose(2);">
            <td>Eve</td>
            <td>Jackson</td>
            <td>94</td>
        </tr>
        <tr onclick="choose(3);">
            <td>John</td>
            <td>Doe</td>
            <td>80</td>
        </tr>
    </table>
    <script>
        /**
         *  
         *  
         * 
         * @author Abdullaev Omonullo, 2015
         */

        var IC = 1;

        function setRow(value) {
            IC = value;
        }

        function getRow() {
            return IC;
        }

    /**** Initialization ****/
    var rows = document.getElementById('table').getElementsByTagName('tr');
    var trLength = rows.length - 1;
    try {
        highlightAll();
    } catch (error) {
        alert('error on getting table: ' + error);
    }
    choose(getRow());
    function highlightAll() {
        var i = 1;
        for (; i <= trLength; i++) {
            highlightByIndex(i);
        }
    }

    /****END Initilization END****/

    function chooseNext(event) {
        if (event.keyCode == 38) {
            goUp();
        } else if (event.keyCode == 40) {
            goDown();
        }
    }

    function goUp() {
        if (IC != 1) {
            choose(IC - 1);
        }
    }

    function goDown() {
        if (IC != trLength) {
            choose(IC + 1);
        }
    }

    function highlight(rowIndex) {
        var row = rows[rowIndex];
        var oldRow = rows[rowIndex];

        highlightByIndex(parseInt(IC));

        row.style.backgroundColor = "aqua";

        IC = rowIndex;
    }

    function highlightByIndex(i) {
        var row = rows[i];

        var colors = [ '#C9EAFF', '#E8F6FF' ];
        row.style.backgroundColor = colors[i % 2];
    }

    function choose(rowIndex) {
        highlight(rowIndex);
    }
</script>

Answer 2

你需要使用javascript，试试datatables它有能力做你需要的。 http://www.datatables.net/examples/server_side/select_rows.html

JSP，JavaScript中的可选表

2 个答案: