javascript - 单击 [提交] -> 隐藏 DIV 容器 1 -> 显示 DIV 容器 2 -> 加载在 DIV 容器 2 中的 .PHP 文件中找到的 DIV

Question

这是我想做的

1 - 点击提交

2 - 隐藏 DIV 容器 1

3 - 显示 DIV 容器 2

4 - 将“PricingDisclaimer.php”中找到的所有 DIV 加载到 Div 容器 2

---

这是我的DIV代码

<div id="MainContainer">

<div class="Container1">
Lalala content
<input type="submit" value="Select" id="Load_Container2"/>
</div>

<div id="Container2" style="display:none;">I want to load all of the DIVs found inside "PricingDisclaimer.php" and place them inside this container</div>
</div>

这是我的 Javascript/Jquery 代码

<script type="text/javascript">
$(document).ready( function() {
$("#Load_Container2").on("click", function() {
    $(".Container1").hide();
    $("#Container2").show();
    $("#Container2").load( "http://www.prismasites.com/wp-content/themes/Prismasites/PricingDisclaimer.php" );

});
</script>

它隐藏了 DIV Container1 [WORKS]

它显示 DIV Container2 [WORKS]

问题:

它不会将 PricingDisclaimer.php 加载到#Container2

这是 PricingDisclaimer.php

<div id="PricingBoxDisclaimer">
<div id="PBDisclaimerTLCorner"></div><div id="PBDisclaimerTMBorder"></div><div id="PBDisclaimerTRCorner"></div>
<div id="PBDisclaimerMLBorder"></div><div id="PBDisclaimerContainr"><div id="PricingDisclaimerTitle"><span><b>DISCLAIMER</b></span></div><div id="PricingDisclaimerContainer"><div id="PricingDisclaimerText">
<?php query_posts('p=1272' ); ?>
<?php if (have_posts()); ?>
<?php while ( have_posts() ) : the_post();?>
<br /><h1>
<?php
the_title();
echo '<br>'; ?></h1><br />
<?php
echo '<p>';
the_content();
echo '</p>';
endwhile; ?>
</div></div><div id="PBDisclaimerMRBorder"></div>
<div id="PBDisclaimerBLCorner"></div><div id="PBDisclaimerBMBorder"></div><div id="PBDisclaimerBRCorner"></div>
</div>

^ 我想要所有这些 ^

在这里

vvvvvv

<div id="Container2" style="display:none;">HERE</div>

我该怎么做？

Answer 1

我想这可能对你有帮助。

$("#Container2").html('<iframe src="http://www.prismasites.com/wp-content/themes/Prismasites/PricingDisclaimer.php"</iframe>');