0

我在下面包含了一个指向我的站点的链接，用于查看头部中的 JS，以及让您了解我是如何设置它的。如果您不想使用该链接，我也会尝试包含下面的代码。

我最近学习了一些基本的 AJAX 并在我的网站 http://classifieds.your-adrenaline-fix.com/detail.php?fatherID=37&TypeID=42&ListingID=42的选择页面上创建了一个对话框，你会看到它出现在 onscroll .

如果有人可以与我分享如何使关闭按钮关闭对话框，我将不胜感激。

这是JS

<script type="text/javascript">
function loaddiv(thediv, thefile) {
    if (window.XMLHttpRequest) {
    xmlhttp = new XMLHttpRequest();
    } else {
    xmlhttp = new ActiveXObject ('Microsoft.XMLHTTP');
    }

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {
            document.getElementById(thediv).innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open('GET', thefile, true);
    xmlhttp.send();
}
</script>

然后在页面上我只有

echo "<div id='div2'></div>";

然后对于弹出的框：

<div class="DoYouHaveADirtBikeForSaleBox">
<h2>Got A Dirt Bike You Want to Sell?</h2>
<p class="DirtBikeForSaleBannerButton">
<a href="http://classifieds.your-adrenaline-fix.com/add.php">Yea, Show Me How</a>
</p>

<p class="DirtBikeForSaleBannerButtonNoThanks">
<a href="CloseDialog">Nope, Get This Out of The Way</a>
</p> 
</div>

如果有人可以与我分享如何通过单击关闭按钮使此对话框消失，我将不胜感激，并提前感谢大家。

谢谢，

斯图尔特 K

4

5 回答 5

0

您可以使用将其从 dom 中删除

element.parentNode.removeChild(element);

或者您可以将元素的显示样式设置为“无”，然后您可以使用它并创建开闭

于 2013-03-20T15:33:16.607 回答
0

如果您不想再次显示，可以致电

document.getElementById('div2').remove();

在关闭按钮的 onclick 方法中。

或者，如果您可能再次使用它，请致电

document.getElementById('div2').style.display = 'none';

从 href 属性调用 close 函数：

<a href="javascript: CloseDialog();">Nope, Get This Out of The Way</a>

于 2013-03-20T15:36:13.273 回答
0

如果您使用的是 jquery，则可以使用“live”方法来完成。即使在 ajax 请求之后，这也会将事件处理程序附加到页面上出现的任何新元素。因此，如果您给 close bit 上课：

<a href="#" class="close_dialog">Nope, Get this out of the way</a>

如果 jquery，你可以使用这个位：

$('.close_dialog').live('click', function(){ $('.DoYouHaveADirtBikeForSaleBox').remove(); });

希望有帮助:-)

于 2013-03-20T15:37:32.837 回答
0

或者你可以试试这个：

<div class="DoYouHaveADirtBikeForSaleBox" id="DoYouHaveADirtBikeForSaleBox">
    <h2>Got A Dirt Bike You Want to Sell?</h2>
    <p class="DirtBikeForSaleBannerButton">
    <a href="http://classifieds.your-adrenaline-fix.com/add.php">Yea, Show Me How</a>
    </p>

    <p class="DirtBikeForSaleBannerButtonNoThanks">
    <a onclick="javascript:document.getElementById('DoYouHaveADirtBikeForSaleBox').style.visibility='hidden';">Nope, Get This Out of The Way</a>

    </p> 
</div>

在我的本地主机 xD 上测试

__ _ __ _ __ _ __已编辑_ __ _ __ _ __ _ __ _ __

最好试试这个，看看滚动是否再次显示 div：

<div class="DoYouHaveADirtBikeForSaleBox" id="DoYouHaveADirtBikeForSaleBox">
    <h2>Got A Dirt Bike You Want to Sell?</h2>
    <p class="DirtBikeForSaleBannerButton">
    <a href="http://classifieds.your-adrenaline-fix.com/add.php">Yea, Show Me How</a>
    </p>

    <p class="DirtBikeForSaleBannerButtonNoThanks">
    <a onclick="javascript:var div = document.getElementById('DoYouHaveADirtBikeForSaleBox');div.parentNode.removeChild(div);">Nope, Get This Out of The Way</a>

----------------------------------------更新2--------- ------------

   <div id='div2'>
    <div class="DoYouHaveADirtBikeForSaleBox" id="DoYouHaveADirtBikeForSaleBox">
    <h2>Got A Dirt Bike You Want to Sell?</h2>
    <p class="DirtBikeForSaleBannerButton">
    <a href="http://classifieds.your-adrenaline-fix.com/add.php">Yea, Show Me How</a>
    </p>

    <p class="DirtBikeForSaleBannerButtonNoThanks">
    <a onclick="javascript:var div = document.getElementById('div2');div.parentNode.removeChild(div);">Nope, Get This Out of The Way</a>

    </p> 
    </div>
    </div>

萨卢多斯 ;)

于 2013-03-20T15:38:33.367 回答
0

您可以在 div2 中制作按钮并添加 onClick 属性，如下所示：

<button onclick="document.getElementById('div2').style.display='none'">Close</button>
于 2013-03-20T15:44:07.227 回答