Home>

javascript - i want to divide the event that occurs on click by div

I'd like to divide the event (class acquisition) generated by clicking into div. I don't know what to do. Please teach me.

<html>
<head>
    <style>
        .video-frame {
            position: relative;
            width: 100%;
            overflow: auto;
            -webkit-overflow-scrolling: touch;
            border: 1px solid #ccc;
        }
        .video-frame__video--click {
            padding-top: 56.25%;
            position: relative;
            width: 100%;
            overflow: auto;
            -webkit-overflow-scrolling: touch;
            border: 1px solid #ccc;
        }
        .video-frame__video--click iframe {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border: none;
            display: block;
        }
        .video-frame img {
            max-width: 994px;
            width: 100%;
        }
    </style>
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
    <!-Video 1->
    
        
            
        
    
    <!-Video 2->
    
        
            
        
    
    <script>
        $('. video-frame__video'). click (function () {
            var vframe = '';
            $(this) .replaceWith (vframe);
            $('. video-frame'). attr ('class', 'video-frame__video--click');
            / * ↑ This will change the class of both video 1 and video 2 when clicked.
            I want to change the class of video 1 when I click video 1 and video 2 when I click video 2
            * /
        });
    </script>
</body>
</html>
javascript
  • Answer # 1 

    $(function () {
  $('. video-frame__video'). on ('click', function () {
    $(this) .closest ('. video-frame'). addClass ('video-frame__video--click'). removeClass ('video-frame');
    var vframe = '';
    $(this) .replaceWith (vframe);
  });
});

  • Answer # 2

    $('. video-frame')⇒$(this) .parent ()

Related articles

Trends