我可以用javascript给一个按钮两个命令吗

Can I give a button two commands with javascript?

本文关键字:两个 命令 按钮 一个 javascript 我可以      更新时间:2023-09-26

我创建了一个分为七个部分的页面,每个页面上有两个colomndiv。当我点击右按钮时,我会滚动到下一列,当我点击左按钮时,会滚动到左列。问题是,假设我在第一页,从第二列滚动到第三列,我离开了页面,必须手动移动x滚动条。有没有一种方法可以让我对按钮进行编程,以强制x溢出?

感谢

CSS

<style>
#contents {
width: 3500px; <!--Total size of the large container-->
height: 200px;
position: absolute; }
#container {
height: 500px;
overflow: hidden;
position: relative;
border: 1px #000 solid;
   }
#container, .col {
width: 500px;<!--total size of each column.-->
}
.col {
float: left;
 }
</style>

HTML

  <!--Column 1--> 
  <div class="col">
<p>Put your content here...</p>
<button class="left">Left</button>
<button class="right">right</button>
 </div><!--end div column 1-->

我为另外6个专栏做了这个。

JAVASCRIPT

<script>
   var colwidth = $('#container').width(),
contwidth = $('#contents').width(),
getOffset = function() {
    return parseInt($('#container').css('margin-left'));
};
 $(".left").click(function(){
if (getOffset() === 0) return false;
$("#contents").animate({left: '+=' + colwidth},500);
$("#container").animate({'margin-left': '-=' + colwidth},500);
});
$(".right").click(function(){
if (getOffset() === contwidth - colwidth) return false;
$("#contents").animate({left: '-=' + colwidth},500);
$("#container").animate({'margin-left': '+=' + colwidth},500);
});
</script>

要为一次点击分配多个函数,您可以从现有函数中调用一个函数,也可以创建一个新函数专门用于调用其他2个函数。