0

我的 AJAX jQuery 脚本和 n 个表单有一点问题......更准确地说,PHP 脚本生成 N 个表单(表单包括一个文本区域和一个按钮),并且在 head 标签中我包含了 jquery 脚本。问题是 jquery 仅适用于第一种形式而不适用于其他形式(第二种,第三种......)。我需要使用所有形式...这是代码:

<script>
    $(document).ready(function() {
    $("#submitForm").click(function() {
        var text = $("#comment").val();
        var id = $("#id").val();

        $.ajax(
            {
                url: "addcomment.php",
                type: "POST",
                data: "t="+ text +"&id="+id,
                success: function(data)
                {
                    alert(data);
                }

            });
    });
    }); 
</script>

这是PHP代码

for($i=0; $i<$num; $i++)
{
     echo "<div style='border: 1px solid black;'>

              <textarea id='comment'></textarea>
              <input type='hidden' id='id' value='".$id."'/>
              <input type='button' id='submitForm' value='Add Comment'>

              </div>";
}

什么问题???

4

2 回答 2

1

对于您创建的每个表单,您都使用相同的 ID。

ID 必须是唯一的,并且只在页面上出现一次。

您应该按照评论中的建议使用一个类。

所以更像这样:

<?php for ($i = 0; $i < $num; $i++): ?>
<div>
    <textarea class="comment"></textarea>
    <input type="hidden" class="id" value="<?php echo $id; ?>">
    <input type="button" class="submitForm" value="Add Comment">
</div>
<?php endfor; ?>

我不确定你的$id变量来自哪里。

您的 JavaScript 也需要更新才能使用,我会做这样的事情(详细说明,以便您可以看到发生了什么):

$('.submitForm').click(function(e) {
    e.preventDefault(); // stops the default form action (if there is one)
    var $submitButton = $(this);
    var $div = $submitButton.parent(); // gets the div container
    var id = $div.find('.id').val();
    var text = $div.find('.comment').val();

    // now do your ajax
});
于 2013-05-19T22:48:43.593 回答
1

在您的 PHP 端,您应该使用与此类似的内容进行更改,以确保所有 html 元素都具有唯一的 id。

for($i=0; $i<$num; $i++)
{
     echo "<div style='border: 1px solid black;'>

              <textarea id='comment".$i."'></textarea>
              <input type='hidden' id='id".$i."' value='".$id."'/>
              <input type='button' id='".$i."' class='submitForm' value='Add Comment'>

              </div>";
}

并使用与此类似的内容更改 Javascript 以反映在 php 端所做的更改

<script>
    $(document).ready(function() {
    $(".submitForm").click(function() {
        var formNumber = $(this).attr("id"); // Get the form number that was clicked, the id attribute of the clicked button
        var text = $("#comment"+formNumber).val(); // Get the comment of that particular form
        var id = $("#id"+formNumber).val(); // get the id of that particula form

        $.ajax(
            {
                url: "addcomment.php",
                type: "POST",
                data: "t="+ text +"&id="+id,
                success: function(data)
                {
                    alert(data);
                }

            });
    });
    }); 
</script>
于 2013-05-19T23:01:40.810 回答