将id/类放在HTML中的正确方法是使用foreach来获得确切的值

The correct way to put the id/class in HTML using foreach to get the exact value?

本文关键字:foreach 方法 HTML id      更新时间:2023-09-26

我已经成功地显示了每个使用的数据。这里是代码:

<?php 
  foreach($jawapan as $row_jawapan):
?>
  <li class="vote-li" >
    <div class="round-button-circle">
      <span></span>
      <h1><?php echo $row_jawapan->answer_text;?></h1>
      <input class="id_answer" type="hidden" value="<?php echo $row_jawapan->id_option;?>">
      <input class="answerswer_text" type="hidden" value="<?php echo $row_jawapan->answer_text;?>">
    </div>
  </li>
<?php endforeach; ?>

现在我想得到确切的值,当用户点击它使用这个代码:

$('.vote-li').on('click', function(){
  var id_question = $('.id_question').val(),
      answer_text = $('.answer_text').val(),
      user_id = $('.user_id').val(),
      id_option = $(this).prop('id');
  var data = {
    id_question: id_question,
    user_id: user_id,
    id_option: id_option,
    answer_text: answer_text
  };
  console.log(data);
});

现在,每当用户单击vote-li类时,即使项目值不同,console.log也只显示第一个索引项目。我认为我在input元素中写入class/id时犯了错误,但我不知道如何放置正确的id/类,以便我的jQuery能够提取正确的数据。

$('.answer_text').val()$('.user_id')使用$(this).find('.id_question')$(this).find('.answer_text')$(this).find('.user_id'),而不是$('.id_question'),因此仅限于当前的.vote-li

更正代码:

$('.vote-li').on('click', function(){
  var id_question = $(this).find('.id_question').val(),
      answer_text = $(this).find('.answer_text').val(),
      user_id = $(this).find('.user_id').val(),
      id_option = $(this).prop('id');
  var data = {
    id_question: id_question,
    user_id: user_id,
    id_option: id_option,
    answer_text: answer_text
  };
  console.log(data);
});