0

大学での課題の一環としてウェブサイトを作成しているので、ビッグバン理論からじゃんけん、トカゲ、スポックのトピックを選びました。Web サイトには、HTML、CSS、および JavaScript のみを含める必要があります (課題に含まれていないため、JQuery を提案しないでください)。私の HTML と CSS はすべて問題ありませんが、以前は JS をあまり使用したことがありませんでした。

じゃんけん、はさみ、リザード、スポックなど、さまざまな選択肢があるコンボ ボックスを作成しました。ページの下に 3 つのテキスト ボックスがあります。JS を使用してコンボ ボックスからテキスト値を取得し、中央のボックスに配置しました。しかし、現在のものよりも優れているものを最初のボックスに、それが優れているものを3番目のボックスに入れたいと思います。

コンボ ボックスで Rock が選択された場合、その文字列 'Rock' は 2 番目 (中央) のボックスに配置されます。 3 番目のボックスに「はさみ」と入力してください。

コンボボックスで選択した値によって、叩くもの、叩くものに変化させたいです。

これが私がこれまでに持っているものです.JSは内部です。

 <!Doctype html>
<html>

<head>
<link rel="stylesheet" type="text/css"
href="Web.css">
<script>
function Choice()
{
var mylist=document.getElementById("myList");
document.getElementById("Choice").value=mylist.options[mylist.selectedIndex].text;

var x= Choice.value;

}
</script>



</head>
<body> 
<div class="font">
<Div class="Containment">

<div class="Heading">
<h1> A BEGINNERS GUIDE TO 
ROCK-PAPER-SCISSORS-LIZARD-SPOCK  </h1>
</div>
<br>

<diV class="Menu">
<a href="Index.html">The Game</a> | <a href="Rock.html">Rock</a> | <a href="paper.html">paper</a> | <a href="scissors.html">scissors</a> | <a href="Lizard.html">Lizard</a> | <a href="Spock.html">Spock</a>
</diV>
<br>
<img class="centerpic" src="images/rpsls2.Jpg" >
<br>
<center>

<div class="text">
Rock-paper-scissors-lizard-Spock is a five-gesture expansion 
of the classic selection method game rock-paper-scissors. 
It operates on the same basic principle, but includes two additional weapons: 
the lizard (formed by the hand as a sock-puppet-like mouth) 
and Spock (formed by the Star Trek Vulcan salute). 
This reduces the chances of a round ending in a tie.
 The game was invented by <br>
 Sam Kass with Karen Bryla.
 </div>
 </center>

<br>
<center> <iframe width="560" height="315" src="http://www.youtube.com/embed/x5Q6-wMx-K8" frameborder="0" allowfullscreen></iframe> 
<!-- This is the code to place and load my youtube linked video -->
<br>
<br>

<div class="text">

This game is featured numerous times in episodes of the Big Bang Theory and 
is normally used similar to why rock papers scissors is used, to settle indecisions, 
as Sheldon attempts to use it to get the office instead of Barry Kripke in this particular episode.
</div>
</center>
<br>
<br>

<div class="text">
Sign matchups:

Select your symbol of choice:
<select id="myList" onchange="Choice()">
  <option></option>
  <option>Rock</option>
  <option>Paper</option>  
  <option>Scissors</option>
  <option>Lizard</option>
  <option>Spock</option>
</select>
<br>
<br>
<input type="text" id="Wins1" width="10"> Beats
<input type="text" id="Choice" width="10"> Beats
<input type="text" id="Loses1" width="10">
<br>
<br>
<input type="text" id="Wins2" width="10">

<input type="text" id="Loses2" width="10">

<div>
</div>
</body>
</html>

すべてのヘルプは大歓迎です。どうもありがとう、クリス

4

1 に答える 1

1

タイトルを改名する必要があります

JavaScript を使用してドロップダウンの値を取得し、条件付きで他の入力フィールドに入力します。

スクリプト全体の概念実証は次のとおりです。

<script>
function run() {
    var truthTable = up();
    console.log (truthTable);
    //Add a value for each input   
    document.getElementById("srt").value = document.getElementById("Ultra").value;
}

function up() {
        var selectedValue = document.getElementById("srt").value,
        truthTable;
    if(selectedValue === 'rock'){
        //push values based on truth table
    }
    else if (selectedValue === 'paper'){
        //push values based on truth table
        var table = [{ "first":"Paper" , "second":"Rock", "third":"Scissors", "fourth":"Lizard", "fifth":"Spock"}];
    console.log (table);
    return table;

    }
    else if (selectedValue === 'scissors'){
        //push values based on truth table
    }
    else if (selectedValue === 'lizard'){
        //push values based on truth table
    }
    else if (selectedValue === 'spock'){
        //push values based on truth table
    }    

}

</script>

ここにフィドルの例があります

結果はたったの5つ。

  1. 結果の真理値表を作成します。

  2. 適切な if ステートメントの table var に、各テーブル データを json として入力します。

  3. テーブルを trueTable var として返す

  4. データを繰り返し、値を適切な入力 ID にプッシュする

    例: //各入力 document.getElementById("srt").value = TruthTable[0].value; の値を追加します。document.getElementById("second").value = TruthTable 1 .value ; document.getElementById("second").value = TruthTable 2 .value ; document.getElementById("4").value = TruthTable[3].value; document.getElementById("5番目").value = TruthTable[4].value;

この例は何をすべきかを示していると思いますが、何をしているのかを学ぶこともできます。

注: 私の例では onClick が発生します。これはケースのトリガーではありません。別のものを使用する必要があります。同じ問題を抱えている他の人を助けるためのリンクを追加しました。

于 2013-06-17T15:31:54.310 に答える