Question

我一直在寻找“在没有刷新页面的情况下在php中更改div内容”，我发现了以下内容并将其应用于：

<script>
$(document).ready(function(){
$('#wwage').submit(function() 
{
    $.ajax(
    {
        data: $(this).serialize(),
        type: $(this).attr('method'),
        url: $(this).attr('action'),
        success: function(response) 
        { 
            $('#wwritemsg').html(response);
        }
    });
    return false;
});
});
</script>

<?php 
    $i=1;
while ( $i<5) 
{ ?>
       <form action="response.php" method="post" name="swages" id="wwage">
          <input name="wpw<?php echo $i; ?>" type="text" value="<?php echo $foo; ?>" />
       <input name="setfoo" type="submit" value="Submit" />
       <div id="wwritemsg">
          <?php  echo "Default pre-submit text.";?>
       </div>
       $i=$i+1;
    }

此代码将创建4个表单，每个表单包含1个输入框和一个提交按钮。替换div ajax脚本不适用于选择性div。它只会覆盖1个。

现在，逻辑结论是将“i”附加到表单id和div id，创建唯一的id，并修改ajax代码以接受这些动态创建的id。但是我缺乏ajax知识，我不知道如何使ajax函数适用于每种形式。

（我可以使用php FOR / WHILE循环生成4个ajax代码块（在本例中），但是如果我将100个表单应用这些函数，它似乎效率不高。循环将创建100字节每个表单/ div的唯一id ajax脚本

Answer 1

诀窍是使用类选择器而不是ID选择器：

 $('.wwage').submit(function() {
    alert(this.id);
    event.preventDefault();
 }
 ) ;

看看这个小提琴http://jsfiddle.net/kdRY7/

Answer 2

关键是使用类而不是ID。

HTML：

<form action="response.php" method="post" name="swages" class="wwage wwage-<?php echo $i; ?>">

的JavaScript：

$('.wwage').submit(function()

你会注意到在while循环期间的HTML部分中，如果出于某种原因你想从另一个表单中选择一个表单，那么它会为每个表单的“唯一”class="wwage wwage-<?php echo $i; ?>">回显一个二级类，您可以通过$(".wwage-4")轻松完成此操作，其中4将指示循环中的相应$i值。

如何动态更改div内容

2 个答案:

HTML：

的JavaScript：