简单的Javascript点击问题

Simple Javascript onclick issue

本文关键字：问题 Javascript 简单      更新时间：2023-09-26

我正在尝试将onclick方法添加到链接中。

我想在用户单击链接 A 时制作 a++，当用户单击链接 B 时制作 a-- 无论值是什么a。

我的代码：

.JS

var a=0;
function swapPost(a){
 //I want to make a++ when user click linkA;
 //a-- when user click linkB
 //not sure how to do this
   if(a>10){
    a=0;
   }
    if(a<0){
    a=0;
   }
}
swapPost(a);

目录

<a href="#" onclick="swapPost(a)">LinkA</a>
<a href="#" onclick="swapPost(a)">LinkB</a>
我

想知道是否有人可以帮助我解决这个问题。多谢。

与其将

a作为参数传入，不如通过其 id（尚未定义）传入单击的链接。 将this传递到函数中。

<a id='linka' href="#" onclick='swapPost(this)'>LinkA</a>
<a id='linkb' href="#" onclick='swapPost(this)'>LinkB</a>
var a=0;    
function swapPost(nodeClicked){
   // Check the id of the node passed to the function.
   if (nodeClicked.id == 'linka') {
     a++;
   }
   else if (nodeClicked.id == 'linkb') {
     a--;
   }
   else return;
   // Set to zero if outside your bounds
   if(a>10){
    a=0;
   }
    if(a<0){
    a=0;
   }
}

这是在行动，登录到控制台...

通常，更好的做法是将函数绑定到事件，而不是将它们内联编码到属性中。 由于onclick内的this是指单击的节点，因此实际上不需要将其作为参数传入。然后，您可以绑定 onclick 事件而不进行内联操作，并在内部调用this。

<a id='linka' href="#">LinkA</a>
<a id='linkb' href="#">LinkB</a>
var a=0;    
var swapPost = function(){
   // Check the id of the node passed to the function.
   if (this.id == 'linka') {
     a++;
   }
   else if (this.id == 'linkb') {
     a--;
   }
   else return;
   // Set to zero if outside your bounds
   if(a>10){
    a=0;
   }
    if(a<0){
    a=0;
   }
}
// Bind the function to the links
document.getElementById('linka').onclick = swapPost;
document.getElementById('linkb').onclick = swapPost;

这是正在运行的更新版本

<a href="#" id="a">LinkA</a>
<a href="#" id="b">LinkB</a>​

.JS

<script type="text/javascript">
window.onload=function(){
    var a=0;
    var els=document.getElementsByTagName('a');
    for(i=0;i<els.length;i++)
    {
        (function(i){
            els[i].onclick=function(){
                if(this.id=='a') a++;
                else a--;
                a = a < 0 ? 0 : (a > 10 ? 0 : a);
                return false;
            }
        })(i);
    }
}
</script>

演示。

试试这个： Javascript：

var a=0;
function swapPost(val){
  a=a+val;
 }

.HTML：

  <a href="#" onclick='javascript:return swapPost(1);'>LinkA</a>
  <a href="#" onclick='javascript:return swapPost(-1);'>LinkB</a>
相关文章：