表单操作和独特ID的困难

Question

我在foreach中有这个代码,列出了唯一代码链接:

<a id="<?php echo $id_to ?>" href="<?php echo ADDRESS; ?>messageSent.php?id=<?php echo $id_to ?>" class="charcoal_link" style="line-height: 20px;" onclick="showMessageArea(this); return false;" >
  <?php echo $uniqueCode1?><span class="pink_text"><?php echo $uniqueCode2?></span><?php echo $uniqueCode3?>
</a>      
<form id="message_area" style="display:none"  method="post" action="<?php echo ADDRESS; ?>messageSent.php?id=<?php echo $id_to ?>">                                
   <textarea name="message" rows="10" cols="20"></textarea>
   <input name="Submit" type="submit" value="Send"></input>
</form>

这是我查看页面源时得到的结果:

<a href="http://www-rainbowcode-mobi/messageSent.php?id=36" class="charcoal_link" style="line-height: 20px;" onclick="showMessageArea(this); return false;" > 
  KUZELJA<span class="pink_text">000</span>RC
</a>      
<form id="message_area" style="display:none"  method="post" action="http://www-rainbowcode-mobi/messageSent.php?id=36">                                
   <textarea name="message" rows="10" cols="20"></textarea> 
   <input name="Submit" type="submit" value="Send"></input> 
</form> 
<a href="http://www-rainbowcode-mobi/messageSent.php?id=38" class="charcoal_link" style="line-height: 20px;" onclick="showMessageArea(this); return false;" > 
  ALANZIM<span class="pink_text">000</span>RC
</a>      
<form id="message_area" style="display:none"  method="post" action="http://www-rainbowcode-mobi/messageSent.php?id=38">                                
  <textarea name="message" rows="10" cols="20"></textarea> 
  <input name="Submit" type="submit" value="Send"></input> 
</form> 

问题是当动作触发并且页面转到messageSent并且我再次查看页面源$id_to不是我点击的链接的ID.无论我点击哪个链接,它都会占用第一个链接的ID？

这里是messageSent页面源码(我点击了ID为38而不是 36的链接):我有一个print_r($_REQUEST)它给出了:

Array
(
   [id] => 36
   [message] => bj,nbgj,
   [Submit] => Send
)

.

function showMessageArea(link)
{
  var message_area = document.getElementById('message_area');
  message_area.parentNode.removeChild(message_area);
  link.parentNode.insertBefore(message_area, link.nextSibling);
  message_area.style.display="block";
}

Answer 1

问题确实是非唯一的 id。

尝试附加$to_id到表单 id，以便它们是唯一的（例如<form id="message_area_<?php echo $to_id; ?>" ...）。

然后更新showMessageArea函数来执行此操作：

var message_area = document.getElementById('message_area_'+this.id);

这样您就可以在所需的表单元素上进行操作。

作为重构建议，我建议使用单个表单，并将id参数设置为<input type='hidden' name='id' id='message_id' value=''>并设置其值，如下所示showMessageArea(...)：

document.getElementById('message_id').value = this.id;