Php 动态创建html模式窗口按钮

我已经创建了一个web应用程序，它的功能之一是列出与特定搜索匹配的产品。 然而，现在我想能够有一个按钮旁边的每一个产品，当按下将打开一个模式框更大的图像和更多的细节。 我知道如何创建一个模式框，并有一个是成功的工作

我的问题是：如何动态创建按钮，使其显示在每个搜索结果的旁边？每个按钮都必须是不同的

<?php //connect to DB
$db = mysqli_connect('localhost','root','notactualpassword','bnh2012')
or die('Error connecting to MySQL server.');

?>

弹出测试
按我
&时代；
这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述描述

可以通过动态类名实现。类名可以与所有模型和按钮相同

$（函数（）{
//获取模态
var modal=$（'div.myModal'）；
//获取打开模式对话框的按钮
var btn=$（“button.myBtn”）；
//获取关闭模态的元素
var span=$（“.close”）；
//当用户单击该按钮时，打开模式对话框
btn.on（'单击'，函数（）{
modal.show（）；
});
//当用户单击（x）时，关闭模式对话框
span.on（'click'，function（）{
modal.hide（）；
});
//当用户单击模式之外的任何位置时，将其关闭
window.onclick=函数（事件）{
如果（event.target==模态）{
modal.style.display=“无”；
}
}
});
/*模式（背景）*/
.莫代尔{
显示：无；/*默认情况下隐藏*/
位置：固定；/*保持原位*/
z指数：1；/*位于顶部*/
填充顶部：100px；/*框的位置*/
左：0；
排名：0；
宽度：100%；/*全宽*/
高度：100%；/*全高*/
溢出：自动；/*根据需要启用滚动*/
背景色：rgb（0,0,0）；/*回退色*/
背景色：rgba（0,0,0,0.4）；/*黑色w/不透明度*/
}
/*模态内容*/
.模态内容{
背景色：#fefe；
保证金：自动；
填充：20px；
边框：1px实心#888；
宽度：80%；
}
/*关闭按钮*/
.结束{
颜色：#AAAAA；
浮动：对；
字号：28px；
字体大小：粗体；
}
.关闭：悬停，
.结束：聚焦{
颜色：#000；
文字装饰：无；
光标：指针；
}

弹出测试
按我
&时代；
这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述这是一个长描述长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述这是长描述描述

引导允许您创建动态按钮。有关单个模型的详细信息，请参见此链接



$（'examplemodel'）。on（'show.bs.modal'，函数（事件）{
var button=$（event.relatedTarget）//触发模式
var recipient=button.data（'whatever'）//从数据中提取信息-*属性
//如有必要，您可以在这里启动AJAX请求（然后在回调中进行更新）。
//更新模式的内容。我们将在这里使用jQuery，但您可以使用数据绑定库或其他方法。
var modal=$（此）
modal.find（'.modal body#image'）.attr（'src'，recipient）
})

缩略标签
测试1


模型

缩略标签
测试2

模型

缩略标签
测试3

模型

&时代；
新消息
接近
发送消息
添加您的代码并显示您的代码您已经完成了哪些工作。@lalithkumar我已经为一个单独的button@ZaidBinKhalid我添加了代码，您的意思是您正在尝试创建动态按钮来显示model@aderrydid你试过这个吗？@我现在就试。我需要将其包含在php标记中。是吗？我在您的代码中找不到任何php内容。如果有，则可以在
中添加它。无错误。只是这个按钮再也不能打开一个模态框了。它什么都不能做。它在我的小提琴上工作。。你会做一些的mistake@aderry请看这个例子。非常感谢。我正在尝试一个不同的实现，因为它不适用于我的应用程序。