如何用javascript做到这一点？它就像一个切换，但我似乎没有找到切换功能

我正在尝试用javascript而不是jQuery来做到这一点。我想点击一张图片，然后图片将有边框，但如果我再次点击它，边框将会消失。不知道如何做任何人都可以帮我一把吗？如何用javascript做到这一点？它就像一个切换，但我似乎没有找到切换功能

allImages = document.getElementsByTagName("img"); 

    for(i=0;i<allImages.length;i++) 
{ 
    allImages[i].onclick=function() 
    { 
    this.style.borderColor="red"; 
    this.style.borderStyle="solid"; 
    } 
}

来源

2013-03-23 Dora

我们能看到你的HTML？我们可以看到你当前的代码吗？您正在寻找哪些DOM方法？ – 2013-03-23 05:25:04

我还没有收到任何东西，因为似乎无法在我的脑海中找到想法，但是我正在使用dom1而不是dom0。我知道onclick函数，但它不会切换。 – Dora 2013-03-23 05:29:24

@ user1850712我们可以看到你的代码吗？ – rab 2013-03-23 05:34:27

用于切换ID为图像试试这个代码

var img = document.getElementById('image-id'); 

if(! img.hasBorder) { 

    img.style.border="2px solid #f00"; 
    img.hasBorder = true; 

} else { 

    img.style.border = ""; 
    img.hasBorder = false; 

}

更新代码

allImages = document.getElementsByTagName("img"); 

for(i=0; i< allImages.length; i++) 
{ 
    allImages[i].onclick = function(e) 
    { 
      this.style.border = (this.style.border == '')? "2px solid red":''; 
    } 
}

来源

2013-03-23 05:31:13 rab

你认为你可以向我解释什么函数e意味着 – Dora 2013-03-23 06:56:55

以及如何 =（this.style.border ==''）？ “2px纯红”：''; 作品 – Dora 2013-03-23 07:01:23

@ user1850712 e是事件对象..有关更多详细信息，请参阅https://developer.mozilla.org/en-US/docs/DOM/event – rab 2013-03-23 07:22:56

尝试：

document.getElementById('id').style.border

来源

2013-03-23 05:24:49

尝试

//显示

document.getElementById('element').style.border = 'red';

//隐藏

document.getElementById('element').style.border = 'none';

来源

2013-03-23 05:32:16

你可以做的是创建两个类有一个边界和第二边界有没有。

现在，当事件触发检查第一类是否适用时，将其删除并应用第二类。

例

var test = document.getElementById("test"); 
var testClass = test.className; 

testClass = (testClass == "first") ? "second" : "first";

来源

2013-03-23 05:32:33

in one line'testClass =（testClass ==“first”）？ “second”：“first”;' – rab 2013-03-23 06:01:41

@rab yes正确...让我更新它 – 2013-03-23 06:03:01

var img = document.getElementById('image-id'); 
img.style.border = img.style.border ? "" : "2px solid red";

来源

2013-03-23 06:50:06 James

如何用javascript做到这一点？它就像一个切换，但我似乎没有找到切换功能

回答

相关问题