Question

我想编写一个函数，每次点击它时都会围绕一个带边框的图像。 UNF。我不能让它发挥作用。否认任何拼写错误导致我没有复制粘贴它。功能有效。但点击它时图像没有任何影响。我是否正确访问border属性？

我的职能：

<script>

function mark(imageId) {
    document.getElementById(imageId).style.border = "1";
}

</script>

我的HTML身体：

<input id="imageId" src="\images\image1.png" onclick="mark(imageId)"/>

Answer 1

你的标记不是完全有意义，但是：

<input id="imageId" type="image" src="http://goo.gl/UohAz" onclick="mark(this)"/>

function mark(el) {
    el.style.border = "1px solid blue";
}

http://jsfiddle.net/8QGkq/

Answer 2

您不希望getParameter()。你想要getElementById()。

您也不希望变量名imageId被mark()的函数声明中的引号括起来，因为它会将其更改为字符串。

正如@John Girata指出的那样，你想为边界值指定的不仅仅是“1”。

document.getElementById(imageId).style.border = "1px solid black";

此外，您需要在onclick属性中引用“imageId”：

<input id="imageId" src="\images\image1.png" onclick="mark('imageId')"/>

Answer 3

将边框设置为“1”对我来说不起作用。试试这个：

<script>

function mark(imageId) {
    document.getElementById(imageId).style.border = "1px solid black";
}

</script>

您还需要在HTML中用引号括起imageId（不确定这是否是拼写错误）：

<input id="imageId" src="\images\image1.png" onclick="mark('imageId')"/>

Answer 4

这是该问题的代码。

<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
    function sayHello() {
        var boyElement = document.getElementById("boy");
        boyElement.style.border = "3px solid red";
    }
</script>
<img src="C:\Users\Acer\Desktop\new web site\js\images\boy.png" id="boy" 
onclick="sayHello()">
</body>
</html>

Answer 5

为了澄清，使用DOM元素设置边框，您需要提供宽度，颜色和样式，如：

document.getElementById("ex1").style.border="1px solid #0000FF";

w3Schools 实际上说：http://www.w3schools.com/jsref/prop_style_border.asp

Answer 6

看看这个：

<img id="CN" src="CN.png" onclick="fnChangeBorder('CN')">

并定义你的功能：

function fnChangeBorder(imageId)

{document.getElementById(imageId).style.border = "solid #AA00FF";}

JavaScript / HTML：在onclick上更改图像边框

6 个答案: