javascript - JavaScript/HTML: onclick で画像の境界線を変更する

Question

クリックするたびに画像を枠で囲む関数を書きたいです。unf。私はそれを機能させることはできません。コピーして貼り付けていないため、タイプミスを否定します。機能が動作します。ただし、画像をクリックしても画像に影響はありません。ボーダー属性にアクセスしましたか?

私の機能：

<script>

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

</script>

私のHTML本文：

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

score 9 · Accepted Answer

マークアップはまったく意味がありませんが、次のようになります。

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

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

score 2 · Accepted Answer

あなたはしたくないgetParameter()。あなたがしたいgetElementById()。

imageIdまた、関数宣言内で変数名を引用符で囲む必要はありません。これは、変数mark()が文字列に変更されるためです。

そして、@John Girata が指摘しているように、border 値に「1」以上を指定する必要があります。

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

さらに、onclick 属性で「imageId」を引用する必要があります。

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

score 2 · Accepted Answer

境界線を「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')"/>

score 0 · Accepted Answer

これを見てください：

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

関数を定義します。

function fnChangeBorder(imageId)

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

score 0 · Accepted Answer

明確にするために、DOM 要素で境界線を設定するには、次のような幅、色、スタイルを提供する必要があります。

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

w3Schoolsは実際に次のように述べています: http://www.w3schools.com/jsref/prop_style_border.asp

6 に答える 6