无法使用 php 循环在 jquery 中获取按钮值/属性答案

【问题标题】：Unable to get button value/attribute in jquery using php loop无法使用 php 循环在 jquery 中获取按钮值/属性
【发布时间】：2021-09-24 07:06:56
【问题描述】：

我正在使用 PHP 开发 jQuery 中的“喜欢”和“不喜欢”模块，而我正面临这两个问题：

目前无法获取按钮的id（喜欢=1，不喜欢=0）
查询显示正确结果，但如何在“喜欢不喜欢”部分显示 ajax 响应？

这是我的代码，下面是 foreach 循环中的代码：

<?php foreach // ?>
 <form class="form-horizontals1" method="post" >
                <input type="hidden"  id="ReviewId" name="ReviewId" value="<?php echo $rev->id;?>">
                
             <button class="likebutn_r" id="show<?php echo "1";?>"  type="submit"><img src="<?php echo base_url(); ?>/assets/img/thumb.png" height="24" width="24"></button>
             <label class="lilkcount">10(dynamic) </label>
            
            <button class="likebutn_r" id="shows<?php echo "0";?>"  type="submit"><img src="<?php echo base_url(); ?>/assets/img/thumbdown.png" height="24" width="24"></button>
             <label class="lilkcount">5(dynamic)</label>
        <div id="counter"></div>
        </form>
    <?php end foreach // ?> 
<script type="text/javascript">
    $(document).ready(function(){
        //likebutn_r
        $('.form-horizontals1').submit(function(e){
            
var ids = $(this).attr('ids');
 console.log(ids);          
        alert($(this).attr("id"));  
                e.preventDefault(); 
 $.ajax({
 url:'<?php echo base_url();?>main/AddVote',
 type:"post",
 data:new FormData(this),
 //dataType: 'json',
 processData:false,
 contentType:false,
 cache:false,
 async:false,
 success: function(data){
     console.log(data);
     alert(data);
    $('#counter').html(data); 
 }
 
 });
        });
    });
</script>

这是我的控制器代码，请告诉我如何在脚本中获得“喜欢不喜欢”的值以及如何在视图中显示结果？

function AddVote()
    {
        $ReviewId=$_POST['ReviewId'];
        $vote=$_POST['vote'];
        echo $result['TotalUpVotes'] = $this->M_main->CountSubmittedCoinVote($ReviewId,$vote);
        echo $result['TotalDownVotes'] = $this->M_main->CountSubmittedDownVotes($ReviewId,$vote);
    }

【问题讨论】：

1) 你得到.attr("ids")，但你的html按钮上有id=..（不是ids）——这并不重要，因为2）你的submit事件在@987654330上@ 所以this 是表单，而不是按钮 3) 可以在不单击按钮的情况下提交表单。如果您不希望表单提交（e.preventDefault），则取消所有表单提交并处理按钮click
这能回答你的问题吗？ jQuery: how to get which button was clicked upon form submission?
或：stackoverflow.com/questions/2066162/… - event.submittedVia 似乎是那里的解决方案，但在 MDN 上看不到（快速查看）
ID 在 HTML 文档中必须是唯一的。只要循环迭代不止一次，您的循环仍会创建 id="show1" 和 id="shows0" 多次。

标签： javascript php jquery ajax

【解决方案1】：

首先，将表单移到循环之外。

 <form class="form-horizontals1" method="post" >
 <?php foreach // ?>
 <div class="my-rev-container js-rev-container">
 ...
 </div>
 <?php end foreach // ?>
 </form>

向输入添加一个类，您可以使用

 <input type="hidden" class="js-form__rev" id="ReviewId" name="ReviewId" value="<?php echo $rev->id;?>">

最终访问它们

 $('.form-horizontals1').submit(function(e){
 var ids = $(this).find(".js-form__rev");
 console.log(ids);

【讨论】：