jQuery:给video元素添加播放监听事件

页面加载时给每个video元素添加监听视频的play事件,由于jquery不能直接添加监听事件,所以使用get(key)获取到原生后再添加。

JS

	 <script>
	    $(function() {
	        $("video").each(function (key, item) {
	            let a = $("video").get(key).addEventListener('play', function (e) {
	                let data = e.currentTarget.dataset
	                let id = data.id
	                let clicknum = data.clicknum
	                ++e.currentTarget.dataset.clicknum
	                if (clicknum > 0) return false //clicknum防止多次点击
	                $.ajax({
	                    type: "POST",
	                    url: "/EcolgCollege/UpdateViewCount",
	                    data: { id: id },
	                    dataType: "json",
	                    success: function (data) {
	                    }
	                });
	            })
	        });
	    });
	 </script>

html

在点击播放按钮时,触发play

	 <div class="view_list" data-tag="false" data-index="@index">
	    <input type="hidden" name="page" value="1" />
	    <ul>
	        @foreach (var item3 in item1.VideoListSecond.Take(pageSize))
	        {
	            <li>
	                <div class="video">
	                    <video  data-id="@item3.Id" data-clicknum="0" src="@item3.VideoUrl" controls="controls" onclick="clickVideo"></video>
	                </div>
	                <div class="text">
	                    <h3>@item3.Name</h3>
	                    <p><span>共<small>@item3.ViewCount</small>人学习</span><span>@item3.Author</span></p>
	                </div>
	            </li>
	        }
	    </ul>
	 </div>
posted @ 2025-05-10 08:54  Dy大叔  阅读(30)  评论(0)    收藏  举报