Question

所以我得到了大部分的php和jquery工作，但我目前正在处理一件事，即如何在按钮点击到jquery的while循环中传递db值？目前没有任何印刷品

<?php
...

if(mysqli_num_rows($result)){
    while($row = mysqli_fetch_assoc($result)){
        print
        "<div class='item  col-xs-4 col-lg-4'>".
            "<div class='row'>".
                "<div class='col-xs-10'>".
                     "<p class='list-group-item-text'>".
                    "<input type='text' class='form-control' id='usr'>".
                    "<button id='button' class='btn btn-success'>Calculate</button>".
                "</div>".
            "</div>".
        "</div>";
    }
}

?>

<script type="text/javascript">
    $(document).on("click", "#button", function(){
        var name = '<?php echo($row['name']); ?>';
        alert(name);
    });
</script>

假设有七个这样的盒子并且用户点击了第四个 - 我如何获得该行名称，比如将其传递给jquery？

Answer 1

尝试以下

if(mysqli_num_rows($result)){
    $i = 0;
    while($row = mysqli_fetch_assoc($result)){
        print
        "<div class='item  col-xs-4 col-lg-4'>".
            "<div class='row'>".
                "<div class='col-xs-10'>".
                     "<p class='list-group-item-text'>".
                    "<input type='text' class='form-control' id='usr_" . $i . "'>".
                    "<button id='button_" . $i . "' class='btn btn-success'>Calculate</button>".
                "</div>".
            "</div>".
        "</div>";

    $i ++;
    }
}

Answer 2

好的，我们需要改变一些事情。 HTML DOM中的每个元素都需要一个唯一的ID。如果多个元素具有相同的id，则机器会非常混乱。这是可以理解的，因为你说他们注意id为#button的按钮！它就像是哪一个？有7.我们可以通过使用循环从db获取的当前行中的id在循环期间为每个按钮添加唯一ID。请注意，在HTML中，元素ID不能以数字开头。这就是我使用button-45等的原因。

我们还可以更改侦听器以侦听按钮的类而不是特定按钮 - 这样，如果点击了具有正确类的页面上的任何按钮，则侦听器会听到它。使用jQuery，您还可以直接向元素添加数据，并使用.data（）进行检索。我在javascript中提供了两个变量，因此您可以看到每种方法的结果。

<?php
...

if(mysqli_num_rows($result)){
    $i = 0;
    while($row = mysqli_fetch_assoc($result)){
        print
        "<div class='item  col-xs-4 col-lg-4'>".
            "<div class='row'>".
                "<div class='col-xs-10'>".
                     "<p class='list-group-item-text'>".
                    "<input type='text' class='form-control' id='usr-".$row['id']."'>".
                    "<button id='button-".$row['id']."' data-id='".$row['id']."' class='btn btn-success btn_calc'>Calculate</button>".
                "</div>".
            "</div>".
        "</div>";
    }
    $i++;
}

?>

<script type="text/javascript">
    $(document).on("click", ".btn_calc", function(){
        var id_only = $(this).data('id'); //this gets us the id
        //you can log values to the console, then right-click and inspect to see the results:
        console.log("id_only = ",id_only);
        //this gets the text into a variable
        var text = $('#usr-'+id_only).val();
        console.log("text = ", text);
        //alert(text);
    });
</script>

Answer 3

您遇到的问题是您尝试在STRING FORMAT中传递数据。在你的脚本中，你将$ row传递出while循环，这样它就不会传递对你有用的东西。如果您有多个按钮，则无法使用ID ATTRIBUTE，但您必须使用CLASS。设置data-id属性，以便您可以从数据库传递值并将ID设置为输入，以便您也可以获取其值。试试这个：

<?php
    if(mysqli_num_rows($result)){
        while($row = mysqli_fetch_assoc($result)){
            print
            "<div class='item  col-xs`-4 col-lg-4'>".
                "<div class='row'>".
               "<div class='col-xs-10'>".
                 "<p class='list-group-item-text'>".
                "<input type='text' class='form-control' id='input-" . $row["id"] . "'>".
                "<button data-id='". $row["id"] . "' class='mybutton btn btn-success'>Calculate</button>".
            "</div>".
        "</div>".
    "</div>";
    }
 }

 ?>

 <script type="text/javascript">
   $(document).ready(function(){
     $(".mybutton").on("click", function(){
        var myid = $(this).attr('data-id');
        var myinput = $('#input-'+myid).val();
        alert("MY ID IS: " + myid);
        alert("MY INPUT VALUE IS: " + myinput);
    });
});
 </script>

单击按钮时，不会传递数据库中的php值

3 个答案: