第二次单击后Jquery触发

时间:2017-05-05 20:36:41

标签: javascript jquery html

我正在研究.NET MVC,我试图在点击div之后播放iframe视频。

HTML

   <div class="entry-post" >

    <h3 class="entry-title" style="cursor:pointer"  onclick="$.Sakla.al('@("ifr"+item.Id)','@item.Link')" >

     @item.Baslik <img src="~/Content/img/com.png" /> </h3>

    <div class="entry-content" >

        <iframe id="@("ifr"+item.Id)" width="560" height="315" frameborder="0" allowfullscreen></iframe>
    </div>
    <hr />
</div>

JS

<script type="text/javascript">
    $(document).ready(function ($) {

        $(".entry-content").hide('slow');

        $(".entry-title").click(function () {

            $(this).parent().children(".entry-content").show(500);
            $.Sakla = {

            al: function (gelenifr,gelenlink) {
                //alert(gelenifr + gelenlink);
                var ifr = $('#'+gelenifr+'');
                    ifr.toggle(function () {
                        if (ifr.is(':visible')) ifr.attr('src', ''+gelenlink+'');
                        else ifr.attr('src', '')
                    })

            }
        }

        });

    });

</script>

所有这些我到目前为止所做的一切。它只在第二次点击div后才有效。那么,我应该想出什么呢?

1 个答案:

答案 0 :(得分:3)

这种情况正在发生,因为您为onclick="$.Sakla.al('@("ifr"+item.Id)','@item.Link')" 设置了两个事件处理程序。

其中一个是HTML中的内联:

document.ready

正在$(".entry-title").click(function () { 回调中设置一个:

document.ready

正如 @Sasang 所指出的,如果我们查看$.Sakla回调,我们可以看到这是定义onclick的位置,因此{{1}处理程序在点击之后才会工作。

不应使用内联HTML事件处理程序(onclickonmouseover等)。而是使用object.addEventListener()或JQuery:object.on("eventName", callback)

在纯JavaScript中注册事件处理程序