0

今天我尝试在javaScript中制作最简单的关闭按钮。不幸的是,它不起作用。这是它的样子:

<div id="popup_bg">
<div id="popup_window">
<span id="popup_close">
</span>
</div>
</div>

js代码是:

<script type=”text/javascript”&gt;
        $("#popup_close").click(function() {
        $("#popup_bg").fadeOut();
        event.stopPropagation();
        });
</script>

我还想让它适用于任何这些“弹出窗口”,所以我可能会将其更改为类似 $(this).parent().parent().fadeOut(); - 可以这样做吗?

谢谢你们的帮助!:)

@编辑

由于您的解决方案都不起作用,因此我将按字面意思放置我的代码:D 也许您会发现一些使其出错的错误:

<?php if(isset(errors['user'])) : ?>    
<script type="text/javascript">
    $(function()
    {
        $("#popup_close").on('click', function() {
        $("#popup_background").fadeOut();
        //event.stopPropagation();
        });
    });
</script>
<div id="popup_background" >
    <div class="popup_window">
        <span class="title">
        error
        </span>
        <span class="message"><?php echo errors['user']; ?>
        </span>
        <span id="popup_close" class="button">OK</span>
    </div>
</div>
<?php endif; ?>

我希望这将帮助您发现任何错误。它显示正确,我单击“确定”跨度,没有任何反应:p 我讨厌 js:D

4

5 回答 5

1

我看到了你的代码,代码的 jquery 部分正在工作。检查这里:Jsfiddle -> http://jsfiddle.net/Zahinize/7YD4D/13/

你应该像这样重写你的条件If语句,

 <? ini_set('error_reporting', E_ALL); ?>

 <script type="text/javascript">
  $(function()
  {
    $("#popup_close").on('click', function() {
    $("#popup_background").fadeOut();
    //event.stopPropagation();
    });
   });
  </script>

 <div id="popup_background" >
  <div class="popup_window">
    <span class="title">
    error
    </span>
    <span class="message">

    <?php 
     if(isset(errors['user'])){      
      echo errors['user']; 
      }
    ?>
     </span>
    <span id="popup_close" class="button">OK</span>
  </div>
</div>

在顶部设置 error_reporting ..

在此处查看更多信息:http: //php.net/manual/en/function.error-reporting.php

也许这会有所帮助,但坦率地说,我还没有看到像这样的错误处理: error['user']任何地方......你应该看到错误处理以编写更好的代码;)

于 2013-02-25T10:40:53.610 回答
1

ID 必须是唯一的,您应该使用类来代替:

<div class="popup_bg">
   <div class="popup_window">
      <span class="popup_close"></span>
   </div>
</div>

然后为了选择被点击元素的目标父元素,你可以使用closest方法:

$(function() { 
    $(".popup_close").click(function(event) {
       $(this).closest(".popup_bg").fadeOut();
       // event.stopPropagation();
    });
});

请注意,在您的代码event中,undefined您应该将事件对象传递给您的处理程序。

于 2013-02-25T09:10:36.470 回答
1

添加document.ready和/或使用.on功能

<script type=”text/javascript”&gt;
    $(function(){
        $("#popup_close").on('click', function() {
            $("#popup_bg").fadeOut();
            event.stopPropagation();
        });
    });
</script>

此外,ID 可能不会在您的文档中重复,请使用其他选择器,例如类

于 2013-02-25T09:12:07.213 回答
0

如果有多个弹出窗口,最好使用 class 而不是 id。

例子。

$(function()
{
    $(".popup_close").on('click',(function()
    {
        $(this).parents("div.popup_bg").fadeOut();
    });
});

html

<div class = "popup_bg">
    <div class = "popup_window">
        <span class = "popup_close"></span>
    </div>
</div>
于 2013-02-25T09:12:32.093 回答
0

您需要一些内容在您的跨度或设置高度和与。然后你就可以点击它,它就会工作。parent().parent()如果您更改 div 结构,请避免使用可能会破坏的技巧。正如其他人所说,如果您打算重用代码,请使用准备好的 jquery 文档(阅读教程)并使用类而不是 ids(阅读 CSS 教程)......

于 2013-02-25T09:17:16.650 回答