如何传递变量以显示模态答案

【问题标题】：How to pass a variable to reveal modal如何传递变量以显示模态
【发布时间】：2015-06-03 06:31:21
【问题描述】：

您好，我正在 wordpress 上开发自己的功能插件，但我一直在尝试将变量从页面传递到在单击链接后打开并显示删除确认对话框的模式

打开模态的链接是

<a href="<?php echo $passing_var?>" data-reveal-id="deleteModal" class="deleteLink">
    <i class="fi-trash size-24 icolored"></i>
</a>

模态窗口代码

<div id="deleteModal" class="reveal-modal" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
    <h2>Are you sure you want to DELETE? <?php echo get_the_title( $passing_var ); ?>  </h2>
    <p class="lead">This cannot be undone</p>
    <a class="deleteButton button" href="#">delete</a>
    <a class="close-reveal-modal">&#215;</a>
</div>

如何将$passing_var从主页面传递到模态窗口？

【问题讨论】：

你可以读取链接的数据属性..
你的意思是使用javascript？你能给我指出一种方法来做到这一点或在某个地方阅读有关如何完成它的信息吗？
是的，我们可以使用 js 读取 attr。
感谢您的超快回答，并对编辑感到抱歉...您能指出一种方法来做到这一点或在某个地方阅读有关如何完成它的信息吗？

标签： wordpress reveal.js zurb-foundation-5

【解决方案1】：

设置数据属性

<a data-id="<?php echo $passing_var?>" class="deleteLink">
    <i class="fi-trash size-24 icolored"></i>
</a>

读取数据属性以在模态中使用

$(document).on("click", ".deleteLink", function () {
     var dataId = $(this).data('id');
     $('#deleteModal').modal('show');
});

【讨论】：

非常感谢，但是我如何从模态中检索传递的变量？我试过但它似乎不是正确的方法...... :(
Alex that will.be available var dataId = $(this).data('id'); here in dataId
您想在 php.ini 中使用该值做什么。根据您的要求，我将能够告诉您解决方案。
我想将帖子 ID 从 wordpress 帖子传递到模态，然后用它做一些功能，例如检索 post_title、post_meta 甚至删除帖子...还有其他方法可以完成吗那？感谢您的提问和您的帮助...
我应该尝试一个表单和一些 ajax 在提交时发布吗？你能帮我@Pardeep Dhingra吗？

【解决方案2】：

经过大量的反复试验和谷歌研究，终于让它工作了......这里没有什么意外...... :(

因此，如果将来有人需要将变量从页面传递到模态，则必须遵循三个步骤...

1.创建模态按钮

<button data-reveal-id="myModal" data-my-number="1">First One</button>

2.添加模态对话框

<div id="myModal" class="reveal-modal"><h2>Awesome. I have it.</h2><p class="lead">The <span class="buttonText"></span>.  It is mine.</p><a class="close-reveal-modal">&#215;</a></div>

3.添加Javascript

$(document).foundation();$('[data-reveal-id]').on('click', function() {var targetModal = $('#' + $(this).data('revealId'));var newText = $(this).text() +' (' + $(this).data('myNumber') + ')';targetModal.find('.buttonText').text(newText);});

如果您想查看工作示例，请访问此link...谢谢大家

【讨论】：