获取 php 变量并将其传递给 jQueryUI 对话框

Question

我正在开发的网站中使用 jQueryUI 对话框小部件。基本上，该页面列出了朋友列表和向每个人发送消息的链接。这是 html 的 sn-p。

...
<td><?php echo $realname; ?></td>
<td><?php echo $username; ?></td>
<td><a href="#" id="opener">Send Message</a></td>
...

我的 javascript 看起来像：

$(document).ready(function() {
 var $dialog = $('#dialog')
  .dialog({
   autoOpen: false,
   resizable: false,
   modal: true,
   height: 350,
   dialogClass: 'no-close',
   draggable: false
 });
 $("#opener").click(function() {
   $dialog.dialog('open');
   return false;
 });
 $('#closedialog').click(function() {
   $dialog.dialog("close");
   return false;
 });
});

最后，在我的 html 的底部，它是：

<div id="dialog" title="Send a message"><form action="<?php echo $currURL; ?>">
 <p>To: {would want for something like "RealName (username)" to appear here}</p>
  <div align="center">
  <textarea cols="40" rows="10"></textarea>
  </div>
 <p align="right"><span class="button" style="text-align: right;">
  <input type="submit" value="Submit" /><button id="closedialog">Cancel</button>
 </span></p>
</form></div>

假设您朋友列表中的第一个人是约翰史密斯 (johnsmith)，下一个是简史密斯 (janesmith)。是否可以仅为该表行传递 $realname 和 $username 的值，以便在 jQuery 对话框小部件中也将其打印出来？ - 或者 - 你对如何更好/更有效地做到这一点有什么建议吗？

Answer 1

• 在对话框中放置一些占位符，找到它们并存储对它们的引用。
• 将您的id="opener" 更改为class="opener"
• 每当点击 .opener 链接时，请在其周围的 TD 中查找您所追求的值并将它们写入您引用的占位符

演示 http://jsfiddle.net/uHXbV/5/

这可以通过使用data- attrs 或类似的东西来进一步增强，但该演示对原始代码的影响尽可能小，以使其易于理解。

Answer 2

您应该在锚标记上使用 onclick 处理程序，而不是将 click 绑定到 #opener，该处理程序使用这些参数调用函数。然后，该函数将设置对话框函数使用的对话框元素的内容。也许是这样的：

<td><a onclick="openDialog('<?= $realname; ?>','<?= $username; ?>');">Send Message</a></td>

那么你的功能是：

function openDialog(realname, username) {
    // set the contents of you dialog elements.
    $('#messageRealname').text('realname');
    $('#messageUsername').text('username');
    // now open the dialog
    $dialog.dialog('open');
}

然后