Javascript Jquery循环表选择框

我有一张桌子，上面有一些票的信息

检查这个表格的html

如何在每个选择框中循环单击？选择框即行会有所不同

请给我一些提示

谢谢你

<table id="tableTickets" class="table table-striped custab">
    <thead>
        <tr>
            <th> Ticket Type </th>
            <th> REMAINING </th>
            <th> Price </th>
            <th> Quantity </th>
        </tr>
    </thead>
    <tbody>
        <tr id="ticketRow1">
            <td id="tdTicketName1">
                <input type="hidden" id="ticketId" name="ticketId" value="1">
                <h4 class="heading1">Name1</h4>
            </td>
            <td id="tdTicketQuantity1">
                100 </td>
            <td id="tdTicketPrice1">
                <div id="divTicketPrice1">12.30</div>
            </td>
            <td>
                <select class="form-control" name="ticketQty" id="ticketQty1" style="height:30px;">
                    <option value="0">0</option>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="6">6</option>
                    <option value="7">7</option>
                    <option value="8">8</option>
                </select>
            </td>
        </tr>
        <tr id="ticketRow2">
            <td id="tdTicketName2">
                <input type="hidden" id="ticketId" name="ticketId" value="2">
                <h4 class="heading1">Name2</h4>
            </td>
            <td id="tdTicketQuantity2">
                200 </td>
            <td id="tdTicketPrice2">
                <div id="divTicketPrice2">12.34</div>
            </td>
            <td>
                <select class="form-control" name="ticketQty" id="ticketQty2" style="height:30px;">
                    <option value="0">0</option>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="6">6</option>
                    <option value="7">7</option>
                    <option value="8">8</option>
                </select>
            </td>
        </tr>
        <tr id="ticketRow3">
            <td id="tdTicketName3">
                <input type="hidden" id="ticketId" name="ticketId" value="3">
                <h4 class="heading1">Name1</h4>
            </td>
            <td id="tdTicketQuantity3">
                100 </td>
            <td id="tdTicketPrice3">
                <div id="divTicketPrice3">23.52</div>
            </td>
            <td>
                <select class="form-control" name="ticketQty" id="ticketQty3" style="height:30px;">
                    <option value="0">0</option>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="6">6</option>
                    <option value="7">7</option>
                    <option value="8">8</option>
                </select>
            </td>
        </tr>
        <tr id="ticketRow4">
            <td id="tdTicketName4">
                <input type="hidden" id="ticketId" name="ticketId" value="4">
                <h4 class="heading1">Name2</h4>
            </td>
            <td id="tdTicketQuantity4">
                200 </td>
            <td id="tdTicketPrice4">
                <div id="divTicketPrice4">15.41</div>
            </td>
            <td>
                <select class="form-control" name="ticketQty" id="ticketQty4" style="height:30px;">
                    <option value="0">0</option>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="6">6</option>
                    <option value="7">7</option>
                    <option value="8">8</option>
                </select>
            </td>
        </tr>
        <tr>
            <td colspan="4" style="text-align:right;">
                <h4 class="heading1">Total <div id="ticketPriceTotal" class="col-sm-12">000</div></h4>
            </td>
        </tr>
    </tbody>
</table>

票型
剩下的
价格
量
名称1
100
12.30
0
1.
2.
3.
4.
5.
6.
7.
8.
姓名2
200
12.34
0
1.
2.
3.
4.
5.
6.
7.
8.
名称1
100
23.52
0
1.
2.
3.
4.
5.
6.
7.
8.
姓名2
200
15.41
0
1.
2.
3.
4.
5.
6.
7.
8.
总数000

检查小提琴上的代码。使用下面的代码，您可以获得每个选择框“onchange”或“onclick”事件

首先给price上课，然后写下面给出的代码，
$（document）.on（“change”，“.form-control”，function（））{
var合计=0；
$（“tbody tr”）。每个（函数（）{
var price=$（this.find（“.price”）.text（）；
var tickets=$（this.find（“.form control”）.val（）；
总计=总票数+（总票数（价格）*总票数（票数））；
})
警报（总数）；
}); 

$（'tableTickets'）。查找（'select'）将选择所有选择框

$(document).ready(function(){
   $('select').on('change',function(){
     alert($(this).val())
   })
})

first give class to to price <div class="price"></div> and then write code given bellow,

$(document).on("change",".form-control",function(){
var total=0;
$("tbody tr").each(function(){

var price=$(this).find(".price").text();
var tickets=$(this).find(".form-control").val();

total=parseFloat(total)+(parseFloat(price)*parseFloat(tickets));
})
alert(total);

});