Question

我有一个已经多次循环的文本字段，它有来自数据库的值，我希望得到每个文本字段的值已经多次循环第一个文本字段的工作但是当我点击但其他文本字段似乎不起作用

$("#order").click(function()
{   
    var IDno_textfield = $("#IDno_textfield").val();
    var name_textfield = $("#name_textfield").val();

    alert("ID no: " + IDno_textfield + " " + " Name: " + name_textfield);
});

这是javascript代码，这是我在迭代的一个文本字段中获取值的代码

            <?php
              $c = 0;   
                if($result->num_rows > 0) 
                {                                   
                    while($row = $result->fetch_assoc()) 
                    {                                       
            ?>          <tr>
                            <td>
                                <img src = "data:image/jpeg; base64 , <?php echo base64_encode($row['product_image']); ?>"height = "250" width = "330">
                            <br>
                                    <div id = "order">
                                            Order now
                                    </div>
                            </td>                       
                            <td>
                                No.
                                    <input type = "text" value = "<?php echo $row['product_IDno']; ?>"
                                    id = "IDno_textfield">
                                    <br>
                                Name: 
                                    <input type = "text" value = "<?php echo $row['product_name']; ?>"
                                    id = "name_textfield">
                                <br>
                                Price:
                                        <input type = "text" value = "<?php echo $row['product_price']; ?>"id = "production_textfield">
                                <p>
                                    Description: <?php echo $row['product_description']; ?>
                                </p>
                            </td>
                        </tr>   
            <?php
                    }
                }
                else
                {
                    echo "No Menu Found";
                }
            ?>

这是用于将数据提取到textfield并迭代文本字段多次的php代码

这是它在第一个文本字段只能工作一次而不能在其他文本字段中工作的结果。如果你帮助我，我将很高兴

Answer 1

对于不同的id元素，你可以这样做：

          <?php 
          $c = 0;   
            if($result->num_rows > 0) 
            {                                   
                while($row = $result->fetch_assoc()) 
                {                                       
         ?>     
     <tr>
                    <td>
                        <img src="data:image/jpeg; base64 , <?php echo base64_encode($row['product_image']); ?>"height="250" width="330">
                    <br>
                            <div id="order-<?php echo $row['product_IDno']; ?>" class="order">
                                    Order now
                            </div>
                    </td>                       
                    <td>
                        No.
                            <input type="text" value="<?php echo $row['product_IDno']; ?>" id="IDno_textfield-<?php echo $row['product_IDno']; ?>">
                            <br>
                        Name: 
                            <input type="text" value = "<?php echo $row['product_name']; ?>" id="name_textfield-<?php echo $row['product_IDno']; ?>">
                        <br>
                        Price:
                                <input type="text" value="<?php echo $row['product_price']; ?>" id="production_textfield-<?php echo $row['product_IDno']; ?>">
                        <p>
                            Description: <?php echo $row['product_description']; ?>
                        </p>
                    </td>
                </tr>   
    <?php
            }
        }
        else
        {
            echo "No Menu Found";
        }
    ?>

和javascript

 $(".order").on('click', function()
 {   
    var productID = $(this).prop('id').replace('order-', '');

    var IDno_textfield = $("#IDno_textfield-" + productID).val();
    var name_textfield = $("#name_textfield-" + productID).val();

    alert("ID no: " + IDno_textfield + " " + " Name: " + name_textfield);
});

页面上的每个元素都应具有唯一标识符“id”。对于包含按钮“Order”的循环中元素的id，只需添加产品本身的标识符“id”，因此每个“id”将是不同的。每个按钮“Order”对于所有按钮“Order”属于相同的类，但对于id总是不同。随后，onclick to该类的按钮获取属性“id”的值并删除所有的通用部分，在您的情况下为“order-”所以它仍然是唯一的部分（id），您可以使用它来查找连接的元素这样得到id的通用部分。

Answer 2

试试这个：

$("#order").click(function() {
var IDno_textfield = $(this).parent('tr').find("#IDno_textfield").val();
var name_textfield = $(this).parent('tr').find("#name_textfield").val();
alert("ID no: " + IDno_textfield + " " + " Name: " + name_textfield);
});

Answer 3

试试这个 <?php $c = 0; $count = 0; if($result->num_rows > 0) { while($row = $result->fetch_assoc()) { $count++; ?> <tr> <td> <img src = "data:image/jpeg; base64 , <?php echo base64_encode($row['product_image']); ?>"height = "250" width = "330"> <br> <div id = "order" data-attr = "<?php echo $count; ?>"> Order now </div> </td> <td> No. <input type = "text" value = "<?php echo $row['product_IDno']; ?>" id = "IDno_textfield_<?php echo $count; ?>"> <br> Name: <input type = "text" value = "<?php echo $row['product_name']; ?>" id = "name_textfield_<?php echo $count; ?>"> <br> Price: <input type = "text" value = "<?php echo $row['product_price']; ?>"id = "production_textfield_<?php echo $count; ?>"> <p> Description: <?php echo $row['product_description']; ?> </p> </td> </tr> <?php } } else { echo "No Menu Found"; } ?>

并且点击事件将更改为.......

$("#order").click(function()
{   
    var id = $(this).attr('data-attr')
    var IDno_textfield = $("#IDno_textfield_"+id).val();
    var name_textfield = $("#name_textfield_"+id).val();

    alert("ID no: " + IDno_textfield + " " + " Name: " + name_textfield);
});

使用javascript从迭代文本字段获取值

3 个答案: