javascript - (JavaScript + PHP)如何告诉40个按钮分别应用于它们所在的表行，而没有40个单独的事件？

假设我有很多产品。每行上都有产品名称，价格和“折扣”？复选框。每个产品都有两个与之关联的值：fullPrice和rebatePrice。如果选择了回扣复选框，则显示rebatePrice；否则，显示fullPrice。

使用PHP，我可以通过为每种产品创建一个类，发出数据库查询并遍历结果来为每行创建一个实例来生成该表，就像这样。

// Get a MySQL resource with all of my available products.
$db = new mysqli('localhost','alibaba','opensesame','myFictionalStore');
$results = $db->query("SELECT * from productsForSale");

// Define a class that takes "product name", "price", and "rebate price" parameters, and builds a table row.
class item {
    function __construct($product,$price,$rebatePrice) {
        echo "
            <tr>
            <td>{$product}</td>
            <td>{$price}</td>
            <td class="rebate">{$rebatePrice}</td>
            <td><input type=\"checkbox\" /></td>
            </tr>
        ";
    }
}

// Instantiate that class so that every row in the result becomes a row in a HTML table.
while ($row = mysqli_fetch_assoc($results)) {
    new item($row['product'],$row['price'],$row['rebatePrice']);
}

这样可以很好地建立我的桌子。不过，我确实有一个问题，就是我在星期天晚上呆了，不太清楚。

我希望每个表格行中的复选框在全价和折扣价之间切换。我应该怎么做？我当前正在尝试使用JS for循环，该循环构建所有复选框的数组，所有回扣单元格的数组，然后在单击框[i]时说console.log回扣单元格[i]，只是为了确保我已经锁定了正确的事情...但是那永远行不通，而且我无法想象为什么...

最佳答案

像这样创建

 $db = new mysqli('localhost','alibaba','opensesame','myFictionalStore');
    $results = $db->query("SELECT * from productsForSale");

    // Define a class that takes "product name", "price", and "rebate price" parameters, and builds a table row.
    class item {
        function __construct($product,$price,$rebatePrice) {
            echo "
                <tr>
                <td>{$product}</td>

                <td><span class="price">{$price}</span><span class="rebate">{$rebatePrice}</span></td>
                <td><input class="showPrice" type=\"checkbox\" /></td>
                </tr>
            ";
        }
    }

    // Instantiate that class so that every row in the result becomes a row in a HTML table.
    while ($row = mysqli_fetch_assoc($results)) {
        new item($row['product'],$row['price'],$row['rebatePrice']);
    }

jQuery是

$('.showPrice').change(function ()
{

    if ($(this).is(":checked")) {

        $(this).parent().prev().find('span').hide();
        $(this).parent().prev().find('span.rebate').show();
    }
    else
    {
        $(this).parent().prev().find('span').hide();
        $(this).parent().prev().find('span.price').show();
    }
});

如果您不想在初始加载时显示回扣价格

在CSS中，您可以将其隐藏。

.rebate
{
   display:none;
}

关于javascript - (JavaScript + PHP)如何告诉40个按钮分别应用于它们所在的表行，而没有40个单独的事件？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21979268/