gpt4 book ai didi

javascript - 根据数据属性用按钮执行不同的操作

转载 作者:行者123 更新时间:2023-11-30 11:56:54 24 4
gpt4 key购买 nike

我只有一个按钮。他的第一个 Action 是停止视频。然后是图标更改和数据状态。他的第二个 Action 是重新加载页面。

问题是,即使我编写了一些条件,我也做不到第二个。有时它什么都不做,有时第二个 Action 与第一个 Action 同时发生。

这是我的 Jquery 代码:

// STOP VIDEO (ACTION 1)
$("#button").click(function(){
$('#button').attr({
src: 'img/film.png',
'data-status':'stop'
});
});

// RELOAD (ACTION 2)
$("#button[data-status='stop']").click(function() {
location.reload();
});

// OTHER METHOD FOR RELOAD (ACTION 2)
if ($("#button").data( "status", "stop" )) {
$("#button").click(function() {
location.reload();
});
}

这是我的 HTML 代码:

<img id="button" src="skip.png" data-status="play">

你能帮帮我吗?

最佳答案

通过多次绑定(bind)点击事件,您将在第二次点击时触发这两个函数。相反,您应该将决定停止/重新加载的逻辑放在一个事件回调中:

$("#button").click(function(){
var button = $(this);

if(button.attr('data-status') === 'stop') {
// Already stopped
location.reload();

} else {
// Stop
button.attr({
src: 'img/film.png',
'data-status':'stop'
)};
}
)};

关于javascript - 根据数据属性用按钮执行不同的操作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37687885/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com