Question

我的网站上有一个页面，我有n + 1个表格（n是网站上的图片数量）

我有这个javascript来提交表单，而无需用户直接查看：

$('#commentform').on('submit', function(){
      $.post($(this).attr('action'), $(this).serialize(), function(response){
            var imgid = $(this).find("input[name='imageid']").val();
            $('#comment-'+imgid).modal('hide');
      },'json');
      return false;
   });

该代码将以类似这样的模式提交表单：

<div id='comment-<?php echo $image->id; ?>' class='modal hide fade' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>
    <div class='modal-header'>
        <button type='button' class='close' data-dismiss='modal' aria-hidden='true'>×</button>
        <h3 id='myModalLabel'>Tilf&oslash;j kommentar til billede <?php echo $orig_name; ?></h3>
    </div>
    <form action="<?php echo base_url(); ?>order/do_updateComment/<?php echo $image->id; ?>" method="POST" id="commentform">
        <div class='modal-body'>
            <textarea name="comment" rows="3" class="span6" placeholder="Skriv din kommentar her..."><?php echo $image->comment; ?></textarea>
            <input type="hidden" name="imageid" value="<?php echo $image->id; ?>" />
        </div>
        <div class='modal-footer'>
            <button class='btn' data-dismiss='modal' aria-hidden='true'>Luk</button>
            <input type="submit" name="submit" class='btn btn-primary' value="Gem kommentar" />
        </div>
    </form>
</div>

这适用于页面上的第一个表单 - 其余所有内容都以错误的方式提交（重定向到提交页面）

我在这里缺少什么？我怀疑它是因为在所有表格上使用id="commentform"，但是如何做到这一点呢？我在网站上找到了一个需要以正常方式提交的表格。

另外在附注中，我想在提交完成后关闭模式，这应该用这些代码行完成：

var imgid = $(this).find("input[name='imageid']").val();
$('#comment-'+imgid).modal('hide');

在javascript中（完成在问题的顶部）

然而，这也不起作用..模态保持打开..

我使用jquery 1.9.0

在Bootstrap 2.x上运行整个事情

Answer 1

我怀疑是因为使用了id =＆＃34; commentform＆＃34;在所有表格上

正确，ID必须是唯一的。使用类是选择多个相似元素的常用方法。

Answer 2

当你在回调中时，对$（this）的引用被删除。将引用保存在帖子之外，它应该可以工作。

jQuery / ajax表单提交不使用多个表单+模态没有关闭

2 个答案: