单击另一个元素

时间:2017-04-19 12:06:45

标签: javascript jquery html css

你好老实说伙计我再次需要你的帮助,我试图做的是下面的脚本显示叠加一旦你点击菜单和我想要做的是在菜单上我有一个模态联系表格一旦我点击它一个关闭的图标或锚点显示我想要做的是当你点击联系表格中的关闭按钮时,叠加层也会关闭。

它的ID是" closepls" 下面的js是创建一个叠加的元素,我试图做的是当你点击模态上的关闭按钮它也会关闭或删除谢谢你

<div class="portfolio-modal modal fade" id="portfolioModal1" tabindex="-1" role="dialog" aria-hidden="true">
<!-- This is the close button -->
    <div class="close-modal" id="closepls" data-dismiss="modal">
       <p class="cl"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span> ClOSE</p>

    </div>



     <div class="modal-dialog">
            <div class="modal-content">


            <!-- First Div -->
             <div class="col-md-6 conone condits">

             <h1> Sample Heading 

            </div>

            <!-- END First Div -->


            <!-- Second Div -->

             <div class="col-md-6 conone">
                                            <!-- Project Details Go Here -->
                   <?php echo do_shortcode( '[contact-form-7 id="52" title="send"]' ); ?>
            </div>
            <!-- END Second Div -->

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

Js

<script> 
 init=()=>{
        //SELECT & BIND (CLICK) EVENT
        document.querySelector('a.menuToggle, a#welcomeDivs').addEventListener('click',modal.overlay.init);
    }
    modal={
        overlay:{
            init:()=>{
                //CREATE OVERLAY 
                var overlay = document.createElement('overlay');
                overlay.id = 'welcomeDivsss';
                //SET (CLICK) EVENT TO REMOVE ITSLEF
                overlay.addEventListener('click',modal.overlay.remove);

                //APPEND TO INTERFACE
                document.body.appendChild(overlay);

                // After overlay added to html. "welcomeDivsss" is overlay id you specified.
                $( "#welcomeDivsss" ).append( '<div class="parela" id="welcomeDiv" <div class="inner_box"> <a onclick="click" class="closes"></a> </div> </div>' );

            },
            remove:(e)=>{
                //REMOVE ITSELF
                e.target.parentNode.removeChild(e.target);
                document.getElementById('welcomeDivsss').remove();
                //Trying to make it happen using this code below 
                document.getElementById('closepls').remove();

            }       
        }
    }

    //ON DOCUMENT LOAD RUN INIT
    document.addEventListener('DOMContentLoaded',init);

</script>

1 个答案:

答案 0 :(得分:0)

答案是

$(function(){
    $('#closepls').click(function(){
                document.getElementById('welcomeDivsss').remove();
    });
});