0

我想知道是否有人可以帮助我或引导我朝着正确的方向前进......基本上我有一个Javascript函数，可以计算票价（来自mysql数据库）和数量（来自drop-下菜单）。Javascript 和 PHP 工作正常……但仅针对第一个结果，该功能不是动态的，确实需要帮助来解决这个问题。

在我的 PHP 中，从 SQL 语句返回一个表：

$postCodeSQL = "SELECT * FROM ticket WHERE locationID IN (SELECT locationID FROM location WHERE postCode LIKE '$pcSearch') ";

$postCoderesult = mysql_query($postCodeSQL) or die(mysql_error());

  while ($pcRow = mysql_fetch_assoc($postCoderesult)) {
                                $ID = $pcRow['ticketID']; //row in ticket table on database
                                $venue = $pcRow['venue'];
                                $ticketPrice = $pcRow['tPrice'];
                                $date = $pcRow['date'];
                                $time= $pcRow['time'];

                        echo "<tr>\n";
                                echo "<td id=\"venuePlace\">$venue <input type='hidden' id='venuePlaceHidden' class='venuePlaceHidden' value='".$venue."'></td>\n";
                                echo "<td id=\"ticketprice\">&pound;$ticketPrice <input type='hidden' id='ticketPriceHidden' class='ticketPriceHidden' value='".$ticketPrice."'></td>\n";
                                echo "<td >
                                        <select name =\"showQuantity\" id=\"showQuantity\" class =\"showQuantity\" onChange=\"calculateCost()\" >
                                                <option value=\"Select\">Select...</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>
                                        </select>

                                    </td>\n";
                                echo "<td id=\"date\">$date <input type='hidden' id='dateHidden' class='dateHidden' value='".$date."'></td>\n";
                                echo "<td id=\"time\">$time <input type='hidden' id='timeHidden' class='timeHidden' value='".$time."'></td>\n";

                                echo "<td> <input type= \"button\" class= \"buyMe\" value= \"Buy\" name=\"buyMe\" onclick=\"grandTotal()\" > 
                                      </td>\n";


                        echo "</tr>\n";

                        }

隐藏字段被插入，因此 Javascript 函数可以解析这些值。JS 函数解析这些值并乘以票的成本 ($ticketPrice) 并将其乘以交付值：

function quantityChange() {
//Select the value of the drop down list       
var quantity = $('.showQuantity option:selected').val();
//get the value of the number from the tPrice column in 'ticket' table
var ticket = parseInt(document.getElementById('ticketPriceHidden').value);
//get the venue value
var venue = document.getElementById('venuePlaceHidden').value;
var date = document.getElementById('dateHidden').value;
var time = document.getElementById('timeHidden').value;
//multiply them together
var total = quantity * ticket;

return {
    venue: venue,
    quantity: quantity,
    ticket: ticket,
    date: date,
    time: time,
    total: total
};
}

function calculateCost () {
var data = quantityChange();

$('#summary').html('You have chosen '+ ' '  + data.quantity  + ' ' + 'tickets @' + ' ' + data.venue + ' = '  + ' ' +  '&pound;' + data.total);
}

如前所述，此函数适用于表返回的顶部结果，但是在我的表中返回的结果不止一个，JS 不适用于这些值。我的问题与重复 ID 有关，因为返回的每个结果都具有相同的 ID。

我给每个结果一个类，但我不能做一个“getElementByClass”方法。请问有人知道如何编辑此代码，以便 JS 函数适用于返回的其他结果吗？我有一种感觉，我可能需要一个 foreach() 循环来声明“对于返回的每个值，应用 JS 函数......”或类似的东西？

非常感谢任何帮助，我正在努力提高我的接受率！

4

2 回答 2

1

用动态 ID 试试这段代码...... 

<script>
function quantityChange(id) {
//Select the value of the drop down list       
var quantity = $('.showQuantity_'+id+'option:selected').val();
//get the value of the number from the tPrice column in 'ticket' table
var ticket = parseInt(document.getElementById('ticketPriceHidden_'+id).value);
//get the venue value
var venue = document.getElementById('venuePlaceHidden_'+id).value;
var date = document.getElementById('dateHidden_'+id).value;
var time = document.getElementById('timeHidden_'+id).value;
//multiply them together
var total = quantity * ticket;

    $('#summary_'+id).html('You have chosen '+ ' '  + quantity  + ' ' + 'tickets @' + ' ' + venue + ' = '  + ' ' +  '&pound;' + total);
}


</script>

<?php 

$postCodeSQL = "SELECT * FROM ticket WHERE locationID IN (SELECT locationID FROM location WHERE postCode LIKE '$pcSearch') ";
$postCoderesult = mysql_query($postCodeSQL) or die(mysql_error());

$i=0;
while ($pcRow = mysql_fetch_assoc($postCoderesult)) {
    $ID = $pcRow['ticketID']; //row in ticket table on database
    $venue = $pcRow['venue'];
    $ticketPrice = $pcRow['tPrice'];
    $date = $pcRow['date'];
    $time= $pcRow['time'];

echo "<tr>\n";
echo "<td id=\"venuePlace\">$venue <input type='hidden' id='venuePlaceHidden_$i' class='venuePlaceHidden' value='".$venue."'></td>\n";
echo "<td id=\"ticketprice\">&pound;$ticketPrice <input type='hidden' id='ticketPriceHidden_$i' class='ticketPriceHidden' value='".$ticketPrice."'></td>\n";
echo "<td >
<select name =\"showQuantity\" id=\"showQuantity_$i\" class =\"showQuantity\" onChange=\"quantityChange($i)\" >
<option value=\"Select\">Select...</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>
</select>

</td>\n";
echo "<td id=\"date\">$date <input type='hidden' id='dateHidden_$i' class='dateHidden' value='".$date."'></td>\n";
echo "<td id=\"time\">$time <input type='hidden' id='timeHidden_$i' class='timeHidden' value='".$time."'></td>\n";

echo "<td> <input type= \"button\" class= \"buyMe\" value= \"Buy\" name=\"buyMe\" onclick=\"grandTotal()\" > 
</td>\n";


echo "</tr>\n";
$i++;
echo "<div id = 'summary_$i'></div>";
}
?>

解释

<script>
function abc(id){
  alert('#ticketPriceHidden_'+id);
  var tph =  document.getElementById('ticketPriceHidden_'+id).value;

 if(tph == ''){
     alert('this field is required......');
 }

}
</script>


<a href="javascript:;" onclick="abc(1);">1</a>
<a href="javascript:;" onclick="abc(2);">2</a>
于 2012-05-23T18:20:23.243 回答
0

如果您有超过一组相同的 ID（用于不同的结果），那么最好将它们与数字一起使用：venuePlaceHidden_01, venuePlaceHidden_02

因此，您需要$num在创建表格的代码中以及在 JS 中分析值的代码中添加圆和递增变量。

于 2012-05-23T18:01:28.580 回答