1. ホーム
  2. javascript

ボタンクリック時のテキストを変更する

2023-09-07 14:49:33

質問

をクリックすると myButton1 ボタンをクリックすると、値が Close Curtain から Open Curtain .

HTMLです。

<input onclick="change()" type="button" value="Open Curtain" id="myButton1"></input>

ジャバスクリプトです。

function change();
{
    document.getElementById("myButton1").value="Close Curtain";
}

今、ボタンがopen curtainと表示されているので、close curtainに変えたいのですが、これでいいのでしょうか?

どのように解決するのですか?

もし私があなたの質問を正しく理解していれば、あなたは「カーテンを開ける」と「カーテンを閉める」を切り替えたいのですね。もしそれが必要なら、これはうまくいくでしょう。

function change() // no ';' here
{
    if (this.value=="Close Curtain") this.value = "Open Curtain";
    else this.value = "Close Curtain";
}

を使う必要がないことに注意してください。 document.getElementById("myButton1") の中で呼ばれるため、change の中で コンテキスト myButton1 -- 文脈というのは、あとでJSの本を読むとわかると思います。

アップデイト :

私は間違っていました。さっき言った通りではありません。 this は要素そのものを参照するわけではありません。これを使えばいいんです。

function change() // no ';' here
{
    var elem = document.getElementById("myButton1");
    if (elem.value=="Close Curtain") elem.value = "Open Curtain";
    else elem.value = "Close Curtain";
}