Javascript 如何获取输入类型的动态id?

Javascript 如何获取输入类型的动态id?,javascript,php,jquery,Javascript,Php,Jquery,我试图在PHPAJAX上构建一个类似的系统。我几乎完成了,但我认为我的方式不正确 代码如下: <?php $query=mysqli_query($conn,"SELECT * FROM posts"); while($data=mysqli_fetch_array($query)){ ?> <table border="1" width="50%" align="center" style="margin-top: 20px;">

我试图在PHPAJAX上构建一个类似的系统。我几乎完成了,但我认为我的方式不正确

代码如下:

<?php $query=mysqli_query($conn,"SELECT * FROM posts");
    while($data=mysqli_fetch_array($query)){

 ?>         
 <table border="1" width="50%" align="center" style="margin-top: 20px;">
    <tr>
        <td> 
            <!-- Name -->
            <strong><?php echo $data["author"] ?></strong>
        </td>
    </tr>
    <tr>
        <td>
            <!-- post content -->
            <?php echo $data["content"]; ?>
        </td>
    </tr>
    <tr>
    <td> 
        <input type="hidden" value="<?php echo $data["id"]; ?>" id="like<?php echo $data["id"]; ?>">
        <button type="submit" id="likebtn<?php echo $data["id"]; ?>">Like</button></td>
    </tr>
</table>

<script type="text/javascript">
    $(document).ready(function() {
        //displaydata();
        // body...

        $("#likebtn"+<?php echo $data["id"]; ?>).click(function(){
            var like= $("#like"+<?php echo $data["id"]; ?>).val();


            $.ajax({
                url: "ajax.php",
                type:"POST",
                async:false,
                data:{
                    "done":1,
                    "id" : like,
                },
                success:function(data){
                    //displaydata();
                    //$("#like").val('');
                }
            });


        }); 

    });
</script>

<?php } ?>



在您的情况下,可以为每个动态按钮使用类

你的密码是什么

<button type="submit" id="likebtn<?php echo $data["id"]; ?>">Like</button></td>

由于您不是通过表单提交,因此不需要声明
名称
属性,也不需要声明
type=“submit”
。您甚至不需要声明
id
。您可以将
onclick
事件写入所有
标记,并使用
this
访问动态数据,动态数据最好/逻辑地存储在
数据id
属性中

首先在php循环中构建按钮,如下所示:

echo "<button data-id=\"{$data['id']}\">Like</button>";

这里有一个小的JSFIDLE演示:

既然您建议使用基于类的选择器,那么使用
数据-
属性而不是
id
如何?然后该值可以是一个原始/不固定的数字/id…这避免了必须切碎另一端的数据以隔离id号。嗨,谢谢!我尝试了这段代码,如果它在循环下,它的工作很好,但是正如预期的那样,代码执行了多次,因为有多个
,但是当我把这段代码放在循环外时,它对我不起作用,请给我看你的整个脚本(给我发一个超链接或类似的)这样我就可以查看您的工作。@Yash让我们将此页面的状态提升到系统认可的分辨率。请向我展示您对我的解决方案的实施情况,以便我提供支持。
$(".btnSubmit").click(function(){

    var id = $(this).attr("id");
    $.ajax({
        url: "ajax.php",
        type:"POST",
        async:false,
        data:{
            "done":1,
            "id" : id,
        },
        success:function(data){
            //displaydata();
            //$("#like").val('');
        }
    });


});
echo "<button data-id=\"{$data['id']}\">Like</button>";
<button data-id="1">Like</button>
<button data-id="2">Like</button>
<button data-id="3">Like</button>
<button data-id="4">Like</button>
$("button").on("click", function(){
    $.ajax({
        url: "ajax.php",
        type:"POST",
        async:false,
        data:{
            "done" : 1,
            "id" : $(this).data("id")
        },
        ...
    });
});