在JavaScript中使用條件菜單和下拉菜單

Question

 var macTeamList = "Team" + "<br>";
  var macScoreList = "Score" + "<br>";
  var nicTeamList = "Team" + "<br>";
  var nicScoreList = "Score" + "<br>";

 $('form').submit(function(e) {

     if ($('input[name="Player1"]').val() ==="Nic") {

      e.preventDefault();
      var nicTeamValue = $('input[name="Team1"]').val();
      nicTeamList += nicTeamValue + "<br>" ;

      var nicScoreValue = $('input[name="Score1"]').val();
      nicScoreList += nicScoreValue + "<br>";

      $('#nicteamcolumn').html(nicTeamList);
      $('#nicscorecolumn').html(nicScoreList);

      return false;
     }

 else if ($('input[name="Player1"]').val() === "Mac") {


      e.preventDefault();
      var macTeamValue = $('input[name="Team1"]').val();
      macTeamList += macTeamValue + "<br>" ;

      var macScoreValue = $('input[name="Score1"]').val();
      macScoreList += macScoreValue + "<br>";

      $('#macteamcolumn').html(macTeamList);
      $('#macscorecolumn').html(macScoreList);

      return false;
 } 
 })

    <form>

<input name="foo" id="team" class="teamcolumn" type="text" value="Team?">
<input name="foobar" id="score" class="inputright" type="text" value="Score?">

<input type="submit" value="Go">

<select name="select" size="1" id="PID">
    <option value="Nic">Nic</option>
    <option value="Mac">Mac</option>
    </select>
</form>
<div  id ="nicteamcolumn" class="teamcolumn TOSRcolumn nicColumn">Team </div>
 <div id="nicscorecolumn" class="scorecolumn TOSRcolumn nicColumn">Score</div>
 <div id="macteamcolumn" class="teamcolumn TOSRcolumn macColumn">Team </div>
 <div id="macscorecolumn" class="scorecolumn TOSRcolumn macColumn">Score</div>

基本上，我讓用戶輸入2個文本值以及從下拉菜單上的2個選項中進行選擇。 如果用戶選擇“ Mac”，則如果他們選擇“ Nic”，則兩個字段中的信息應打印到#macscorecolumn and #macteamcolumn ，反之亦然。 list變量跟蹤整個分數列表，因此將新分數簡單地添加到末尾並全部顯示出來。 不知道為什么腳本不起作用。 任何幫助都是極好的

Answer 1

首先，您的代碼實際上需要重寫:)

1. 您無需提交表單即可執行此類操作，您只需添加一個鏈接或一個按鈕（對於GO），向其中添加一個click函數，然后在其中進行操作即可。
2. 我也同意Kunal的觀點，你的if語句語法不正確，等等。

只是多練習一些，請記住，jQuery文檔是您的朋友... :)

這是您修改的代碼，使其可以為您工作。 但是請記住，您不需要這種形式，我只是沒有時間為您改寫其他形式。 我還包括了jQuery庫，以防萬一您錯過了它，這很關鍵。

    <form>

<input name="foo" id="team" class="teamcolumn" type="text" value="Team?">
<input name="foobar" id="score" class="inputright" type="text" value="Score?">

<button id="dostuff" value="Go">Go</button>

<select name="select" size="1" id="PID">
    <option value="Nic">Nic</option>
    <option value="Mac">Mac</option>
    </select>
</form>
<div  id ="nicteamcolumn" class="teamcolumn TOSRcolumn nicColumn">Team </div>
 <div id="nicscorecolumn" class="scorecolumn TOSRcolumn nicColumn">Score</div>
 <div id="macteamcolumn" class="teamcolumn TOSRcolumn macColumn">Team </div>
 <div id="macscorecolumn" class="scorecolumn TOSRcolumn macColumn">Score</div>
    <script src="js/jquery-1.6.4.min.js"></script> 

<script>    
        var macTeamList = "Team" + "<br>";
      var macScoreList = "Score" + "<br>";
      var nicTeamList = "Team" + "<br>";
      var nicScoreList = "Score" + "<br>";

     $('#dostuff').click(function(e) {
                e.preventDefault();
                var teamvalue = $('input[name="foo"]').val();
                var teamscore = $('input[name="foobar"]').val();
                var pidType = $("#PID").val();


         if (pidType =="Mac") {

          nicTeamList += teamvalue + "<br>" ;
          nicScoreList += teamscore + "<br>";

          $('#nicteamcolumn').html(nicTeamList);
          $('#nicscorecolumn').html(nicScoreList);

         }

            else {


          macTeamList += teamvalue + "<br>" ;
          macScoreList += teamscore + "<br>";

          $('#macteamcolumn').html(macTeamList);
          $('#macscorecolumn').html(macScoreList);


     }
     });
</script>

Answer 2

如果條件已用過，則必須使用其他條件

否則if {} //語法錯誤

否則if（“某物進入這里”）{//您的代碼} //正確的方式

在這里，只有別人能做這件事

你推桿; 在if語句的塊末和else的塊末。 語法錯誤