Question

我在网站上创建了几个jPlayer实例。每个实例都必须通过iframe代码加载，并且只能同时播放一个实例。每个iframe都具有以下ID："iframe_1"，"iframe_2"等。

在内部js文件中，我创建了这样的函数：

$( ".jp-playlist").click(function() {
    //some code                  
    window.parent.$('iframe_'+playingNow).contents().find(".jp-stop").click();

});
$( ".jp-play").click(function() {
    //some code                  
    window.parent.$('iframe_'+playingNow).contents().find(".jp-stop").click();

});

当我单击附加到类".jp-play"或".jp-playlist"的任何元素时，整个页面将滚动到触发元素的顶部。

有人可以帮助我找到其他方法来停止所有玩家（除了玩一个），或者只是解决滚动问题？

Answer 1

您可以使用event.preventDefault()来防止单击元素的默认操作。

$( ".jp-playlist, .jp-play").click(function(e) {
    //some code   
    e.preventDefault();               
    window.parent.$('iframe_'+playingNow).contents().find(".jp-stop").click();

});

如果您单击的元素是将a属性设置为href的链接（#元素），它将导致页面滚动到顶部。将href更改为javascript:void(0)或等效地更改为javascript:;。

<div style="margin-top: 500px;"></div>
<a href="javascript:;">Clicking here will not scroll to the top of the page</a><br/>
<a href="#">Click here to scroll to the top of the page</a>

Answer 2

让我们使用正确的

$( ".jp-playlist, .jp-play").on("click", function(e){
    e.preventDefault();
    //your code 
});

jquery e代表event。

jQuery .click（）导致页面滚动

2 个答案: