javascript - 就像系统 : Looping forms unique id, 使用 jQuery/Javascript 获取这些 id 来单独发布一样

Question

我只是通过构建我自己的基于 IP 的 Like 系统来搞乱简单的 PHP 和 Java。

尝试寻找解决方案，但到目前为止还没有成功。

HTML 在 php EOT 中的 while 循环中生成表单，显然每个表单都有唯一的 id。有 25 个带有“赞”按钮的表单。这些表单位于 Bootstrap Modal 内。因此，因为它位于模态中，所以我不希望它刷新页面并重置我的“显示更多”列表。我试图让所有表单都能够使用 javascript 按 id 按项目提交“赞”。代码如下。

有什么建议或不同的方法吗？

HTML - PHP While 循环(模态中的形式):

<p id="result{$itemID}"></p>

<form enctype="multipart/form-data" 
    action="{$postLike}"
    id="myform{$itemID}"
    name="{$itemID}"
    method="post">

    <input type="hidden" 
       name="itemids" 
       value="{$itemID}">

    <input type="hidden" 
       name="ips" 
       value="{$ips}">

    <button id="submit-btn{$itemID}" 
       class="btn btn-{$optionLikeColor}" {$optionLikeDisabled}>

           <span class="glyphicon glyphicon-thumbs-up glyphr" 
               aria-hidden="true">
           </span> {$optionILikeText} {$likes}

    </button>

</form>

PHP:

<?php

   require 'init.php'; 

if($_SERVER['REQUEST_METHOD'] == 'POST' && !empty($_POST['itemids'])){

if($link === false){
    die("ERROR: Could not connect. " . mysqli_connect_error());
}

$itemsid = mysqli_real_escape_string($link, $_POST['itemids']);
$itemsip = $_SERVER['REMOTE_ADDR'];


if ($result = mysqli_query($link, "SElECT * FROM likes WHERE itemID='$itemsid' AND ip='$itemsip'")) {

    $row_cnt = mysqli_num_rows($result);

    if($row_cnt > 0){
            echo 'You\'ve have already liked this item.';
    } else {

        $sql = "INSERT INTO likes (itemID, ip) VALUES ('$itemsid', '$itemsip')";
        if(mysqli_query($link, $sql)){
            echo 'Thank you!';      
        } else {
            echo 'Something went wrong, try again later!';  
        }


    }   

}

} else {

     echo 'Something went wrong, try again later!';

}

     mysqli_close($link);   

?>

Javascript 可以工作，但仅适用于第一种形式:所以我猜我需要将 form/id 变量传递到: $('#myform'), $('#insert'), $('#myform :input') 和 $('#result')

$('#myform').submit(function(){
     return false;
});

$('#insert').click(function(){
   $.post( 
     $('#myform').attr('action'),
     $('#myform :input').serializeArray(),
     function(result){
       $('#result').html(result);
     }
   );
 });

Javascript 概念显然不起作用:P 有建议吗？

   $("[id^='myform']").submit(function(){
        var ID = $(this).attr('name');
        return false;
   });

    $(document).ready(function(){
        $(document).on('click','#submit-btn'+ID,function(){
           $.post( 
             $('#myform'+ID).attr('action'),
             $('#myform${ID} :input').serializeArray(),
             function(result){ $('#result'+ID).html(result); }
             );
         });
     });

Answer 1

将所有表单指定为同一类，或者通过某种方式来唯一地选择这些表单。您不需要所有这些元素都有唯一的 ID。

然后:

$(".myFormClass").on("submit", function () {
  var $f = $(this); // the form that got submitted
  $.post( 
    $f.attr('action'),
    $f.find('input').serializeArray(),
    function(result){
      // not sure where you wanted the result.  
      // The point is that you should select it relative to the form $f that you already know.
      $f.find('span').html(result);
    }
  );
});