gpt4 book ai didi

javascript - 将远程页面打开到 Bootstrap 模式

转载 作者:行者123 更新时间:2023-11-30 22:35:47 25 4
gpt4 key购买 nike

这里似乎有重复问题。我想从远程页面将内容打开到模式中,该页面是从 MySql 数据库填充的。我还希望使用我的自定义样式等打开该模式。到目前为止,我已经做到了,但在那之后我就卡住了。这是到目前为止的代码

页面输出:

$output .='<h4><a class="md-trigger" data-OfferID="' . $offer_id . '" href="#" data-modal="offer_modal">' . $title . '</a></h4><hr>';

点击输出时加载数据的模态(位于 footer.php 中):

<div id="offer_modal" class="md-modal md-effect-flip" aria-hidden="true">
<div class="md-content">

</div>
</div>

位于回显 $output 的页面中的脚本:

$('.md-trigger').click(function(){
var OfferID=$(this).attr('data-OfferID');
$.ajax({url:"Open-Offer.php?OfferID="+OfferID,cache:false,success:function(result){
$(".md-content").html(result);
}});
});

作为引用,远程页面根据id加载数据,然后填充模态:

<?php
extract($_GET);
?>

<?php
require('inc/connect/config.php');
$offer = (int) $_GET['OfferID']; ?>
<?php
try {

$code_sql = 'SELECT * FROM codes WHERE id LIKE :code_id';
$query = $db->prepare($code_sql);
$code_params = array(':code_id' => $offer);
$query->execute($code_params);

$code_r = $query->fetch(PDO::FETCH_ASSOC);
$c_title = $code_r['title'];
$c_desc = $code_r['description'];
$c_redeem = $code_r['redemption'];
$c_textcode = $code_r['textcode'];
$c_exp = $code_r['expiry'];
$c_terms = $code_r['terms'];
$c_url = $code_r['url'];

} catch (PDOException $e) {
echo "failed to load offer";
exit;
}
?>

<button type="button" class="close close-md" data-dismiss="modal" aria-label="Close"><h3><span aria-hidden="true">&times;</span></h3></button>
<h5><?php echo $c_title; ?></h5>
<p><?php echo $c_desc; ?></p>
<h3><?php echo $c_textcode; ?></h3>
<p><?php echo $c_redeem; ?></p>
<p class="small-text"><?php echo $c_terms; ?></p>

目前,我遇到的问题是模态仅加载一次,当单击列表中的顶部项目时,单击列表中的任何其他项目时它不会加载...我做错了什么!!我对这一切都很陌生,所以请放轻松:)

提前致谢

凯莉

最佳答案

用这个例子测试。

$('.md-trigger').on('click',function(){
var OfferID=$(this).attr('data-OfferID');
$.ajax({url:"Open-Offer.php?OfferID="+OfferID,cache:false,success:function(result){
$(".md-content").empty().append(result);
}});
});

关于javascript - 将远程页面打开到 Bootstrap 模式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32589794/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com