0

ボタン(ジョン)がクリックされたときに、挿入された値をテキストボックスに出力しようとしています。現時点では、ここにデフォルト値を追加しました(John = new Player(30、 "England"、3)); しかし、私はこれらの値をテキストボックスから選択したいと思います。どうすればいいのか教えてください。テキストボックスから値を取得して変数に割り当て(スクリプトでコメントアウトされたx、y、z)、ここに渡してみました(John = new Player(x、y、z)); しかし、それはうまくいかなかったようです。

Age : <input type = "text" id = "test1" /><br>
County : <input type = "text" id = "test2" /><br>
Rank: <input type = "text" id = "test3" /><br>

<button type="button" onclick="John.myPlayer()">John</button>

<br>

<br>
<div id = "box"></div>
<br>



<script type="text/javascript">

// var x = document.getElementById('test1').value;
// var y = document.getElementById('test2').value;
// var z = document.getElementById('test3').value);

function Player(a,c,r){
this.age=a;
this.country=c;
this.rank=r;
}

Player.prototype.myPlayer = function(){

document.getElementById('box').innerHTML = "John is from " + this.country + " he is       " + this.age + " years old and his rank is " + this.rank;

}

John= new Player(30,"England",3);

John.myPlayer()


</script>
4

2 に答える 2

0

私の提案は、onclick イベントで呼び出される関数を作成し、そこでテキスト ボックスから値を読み取り、その後 Player の新しいインスタンスを作成することです。

<button type="button" onclick="createNewPlayer()">John</button>

そしてJavaScriptで:

function createNewPlayer() {

  var x = document.getElementById('test1').value;
  var y = document.getElementById('test2').value;
  var z = document.getElementById('test3').value);

  John= new Player(x, y, z);
  John.myPlayer()
}
于 2012-08-17T11:43:09.923 に答える
0

このようにしてみてください..

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
    function show(){

        var age = document.getElementById('test1').value;
        var country = document.getElementById('test2').value;
        var rank = document.getElementById('test3').value;

        John = new Player(age, country, rank);
        John.myPlayer();
    }
    Player.prototype.myPlayer = function() {
        var output = "John is from " + this.country + " he is " + this.age + " years old and his rank is " + this.rank;
        document.getElementById('box').innerHTML = output;
}

    function Player(a,c,r){
        this.age=a;
        this.country=c;
        this.rank=r;
    }

    </script>
</head>

<body>

    Age : <input type = "text" id = "test1" /><br>
    County : <input type = "text" id = "test2" /><br>
    Rank: <input type = "text" id = "test3" /><br>

    <div id="box">
    </div>

    <button type="button" onclick="show()">John</button>

</body>
</html>
于 2012-08-17T11:48:32.050 に答える