javascript - 一项功能可以预订多个不同的航类？

Question

我有以下 js fiddle :

编辑:http://jsfiddle.net/Godin1/z8zD5/6/

HTML:
<table align="center" class="table table-bordered" style="border-radius: 15px;">
<col width="350">
    <col width="600">
        <col width="150">
            <tr>
                <th>Destination</th>
                <th>Description</th>
                <th>Price</th>
            </tr>
            <tr>
                <td>Villa Jibacoa
                    <br>
                </td>
                <td>
                    <ul>
                        <li>255 rooms</li>
                        <li>One 9-storey building</li>
                        <li>4 restaurants</li>
                        <li>5 bars</li>
                        <li>Pool</li>
                        <li>110 and 220 volts (adaptor required)</li>
                    </ul>
                </td>
                <td>$784
                    <div style="position: relative; margin-top: 40px;">
                        <button id="first" type="button" onclick="SeatAssignment()" class="btn btn-success">Book Now!</button>
                    </div>
                </td>
            </tr>
            <tr>
                <td>Gran Caribe Puntarena
                    <br>
                </td>
                <td>
                    <ul>
                        <li>110 rooms</li>
                        <li>Bungalow-style villas</li>
                        <li>2 restaurants</li>
                        <li>2 bars</li>
                        <li>Pools</li>
                        <li>220 volts (adaptor required)</li>
                    </ul>
                </td>
                <td>$947
                    <div style="position: relative; margin-top: 40px;">
                        <button type="button" onclick="SeatAssignment()" class="btn btn-success">Book Now!</button>
                    </div>
                </td>
            </tr>
</table>

Javascript:

var SeatSection;
var seats = (11);
var firstClass = 1;
var economy = 6;
var seatselection;

seats = 0;

function SeatAssignment()
{
        seatselection = window.prompt("Please select 1 for firstclass and 2 for economy");

        if (seatselection == 1 && firstClass <=5 && seats == 0)
            {

                window.alert("You have been assigned first class seat #" + firstClass);
                seats[firstClass] = 1;
                ++ firstClass;                                    
            }
        else if (seatselection == 2 && economy <=10 && seats == 0)
        {
            window.alert("You have been assigned economy class seat #" + economy);
                seats[economy] = 1;
                ++ economy; 
        }

        else 
        {
            window.alert("Seats are full");
        }


}

我不确定为什么“立即预订”选项目前不起作用，但基本上会弹出一个窗口，您输入 1 或 2 以获得头等舱或经济舱座位。将有多个目的地可供前往，因此我需要为每个地方“立即预订”。然而，目前所有按钮都具有相同的功能，因此座位在一架飞机和另一架飞机之间并不排斥。我想知道是否必须创建一个不同的功能来处理每个不同航类的座位，或者我可以在某个地方仅使用一个功能来做到这一点吗？

谢谢

Answer 1

首先，修复你的 fiddle ，而不是:

function SeatAssignment() {...}

将函数分配给变量，如下所示:

SeatAssignment = function() {..}

您可以在此处了解差异:var functionName = function() {} vs function functionName() {}

然后，要处理多个航类，请添加一个参数，您可以通过该参数传递与此按钮关联的航类/目的地。

所以你的函数现在变成这样:

SeatAssignment = function(flight) {
   console.log(flight);
   ... } 

然后将适当的信息作为参数包含到您的 onclick 调用中:

<button type="button" onclick="SeatAssignment(2)" class="btn btn-success">Book Now!</button>

更新的 fiddle :http://jsfiddle.net/z8zD5/5/