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; ?>

それがエラーの発見に役立つことを願っています。正しく表示されます。「OK」スパンをクリックしても何も起こりません：p jsが嫌いです：D

4

5 に答える 5

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 に答える
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

私はあなたのコードを見ました、コードの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 に答える
0

複数のポップアップがある場合は、idの代わりにclassを使用することをお勧めします。

例。

$(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構造を変更すると、このトリックが機能しなくなる可能性があるので避けてください。他の人が言っているように、コードを再利用する場合（CSSチュートリアルを読む）は、jqueryドキュメントを使用して（チュートリアルを読んで）、IDではなくクラスを使用してください...

于 2013-02-25T09:17:16.650 に答える