javascript - 单击更改按钮和 div

Question

你好，我需要用“view 360”按钮模拟这个网站的功能:http://www.designrattan.co.uk/daybed/apple

我已经解决了 360 脚本，只是我无法解决这个按钮？

我在这里尝试过: http://designliving.tk/winchester-rattan-garden-round-table-set

但是如您所见，有几处是错误的。

我需要在单击按钮时更改 DIV，但我还需要在每次单击时更改按钮(从“view 360”到“view image”)。

除此之外，我还需要我的照片选项卡中的图像能够将 div 和按钮更改回“view 360”

我想我有 JavaScript，但我不知道如何将它与 HTML 结合使用

$('.yourButton').bind('click',function(){
if (!$('.yourButton').hasClass('dragMode')) {
    $('.yourButton').addClass('dragMode');
    $('.yourButton').attr('value')="Drag [...]";
} else { // if in drag mode
    $('.yourButton').removeClass('dragMode');
    $('.yourButton').attr('value')="View 360";
}
});

$('.yourTabImages').bind('click',function(){
if ($('.yourButton').hasClass('dragMode')) {
    $('.yourButton').removeClass('dragMode');
    $('.yourButton').attr('value')="View 360";
}
});

我希望这一切都有意义!

谢谢大家!

Answer 1

如果你使用 jquery，它可以很容易地通过类似的东西实现:

$('.yourButton').bind('click',function(){
    if (!$('.yourButton').hasClass('dragMode')) {
        $('.yourButton').addClass('dragMode');
        $('.yourButton').attr('value')="Drag [...]";
    } else { // if in drag mode
        $('.yourButton').removeClass('dragMode');
        $('.yourButton').attr('value')="View 360";
    }
});

$('.yourTabImages').bind('click',function(){
    if ($('.yourButton').hasClass('dragMode')) {
        $('.yourButton').removeClass('dragMode');
        $('.yourButton').attr('value')="View 360";
    }
});

通过这种方式，您可以在处理点击事件时选择要调用的方法时验证按钮处于哪种模式。希望这有帮助