DIV不顯示鏈接變量

Question

出於某種原因，現在當我點擊一個按鈕時，某個div會顯示出來。我對JS相當陌生，所以無法弄清楚爲什麼只有那個。基本上的順序應該是

點擊添加射擊 - >顯示遊戲和回合（工程正常） - >點擊提交 - >在每一輪顯示目標（Works Fine） - >點擊目標 - >顯示填寫表單「fillshotsdiv」）（不工作）。

以下是我的代碼。我錯過了什麼？

JS

<script> 
$(function() { 
    $(".but").on("click",function(e) { 
     e.preventDefault(); 
     $(".contentfill").hide(); 
     $("#"+this.id+"div").show(); 
    }); 
}); 
function refreshTargets() { 
    var load = $.get('functions.php',{gameShots:"<?php echo $_GET['gameShots']; ?>", roundShots:"<?php echo $_GET['roundShots']; ?>",function:"drawTargets"}); 
    $(".targetinfo").html('Refreshing'); 
    load.error(function() { 
     console.log("Mlkia kaneis"); 
     $(".targetinfo").html('failed to load'); 
     // do something here if request failed 
    }); 
    load.success(function(res) { 
     console.log("Success"); 
     $(".targetinfo").html(res); 
    }); 
    load.done(function() { 
     console.log("Completed"); 
    }); 
} 
</script> 

HTML

<div id="addshotsdiv" class="contentfill"> 
    <form action=""> 
    <select name="gameShots" class="gameShot"> 
    <script> 
     refreshGameDel(); 
    </script> 
    </select> 
    <select name="roundShots" class="roundShot"> 
     <option value="nothing">-----</option> 
     <option value="Round 1">Round 1</option> 
     <option value="Round 2">Round 2</option> 
    </select> 
    <button type="submit" >Submit</button> 
    </form> 
</div> 


<div class="targetinfo"> 
    <script> 
    refreshTargets(); 
    </script> 
</div> 


<div id="fillshotsdiv" class="contentfill"> 
    <form method="post" action="addScoreToRound.php?targetNo=<?php echo $_GET['targetNo'];?>&gameNo=<?php echo $_GET['gameNo'];?>&roundName=<?php echo $_GET['roundName']; ?>"> 
    <table border="1"> 
     <tr><th>Shot Number</th><th>Arrow 1</th><th>Arrow 2</th><th>Arrow 3</th></tr> 
     <tr><td>1</td><td><input type="text" name="arrow_1_1"></td><td><input type="text" name="arrow_1_2"></td><td><input type="text" name="arrow_1_3"></td></tr> 
     <tr><td>2</td><td><input type="text" name="arrow_2_1"></td><td><input type="text" name="arrow_2_2"></td><td><input type="text" name="arrow_2_3"></td></tr> 
     <tr><td>3</td><td><input type="text" name="arrow_3_1"></td><td><input type="text" name="arrow_3_2"></td><td><input type="text" name="arrow_3_3"></td></tr> 
     <tr><td>4</td><td><input type="text" name="arrow_4_1"></td><td><input type="text" name="arrow_4_2"></td><td><input type="text" name="arrow_4_3"></td></tr> 
     <tr><td>5</td><td><input type="text" name="arrow_5_1"></td><td><input type="text" name="arrow_5_2"></td><td><input type="text" name="arrow_5_3"></td></tr> 
     <tr><td>6</td><td><input type="text" name="arrow_6_1"></td><td><input type="text" name="arrow_6_2"></td><td><input type="text" name="arrow_6_3"></td></tr> 
     <tr><td>7</td><td><input type="text" name="arrow_7_1"></td><td><input type="text" name="arrow_7_2"></td><td><input type="text" name="arrow_7_3"></td></tr> 
     <tr><td>8</td><td><input type="text" name="arrow_8_1"></td><td><input type="text" name="arrow_8_2"></td><td><input type="text" name="arrow_8_3"></td></tr> 
     <tr><td>9</td><td><input type="text" name="arrow_9_1"></td><td><input type="text" name="arrow_9_2"></td><td><input type="text" name="arrow_9_3"></td></tr> 
     <tr><td>10</td><td><input type="text" name="arrow_10_1"></td><td><input type="text" name="arrow_10_2"></td><td><input type="text" name="arrow_10_3"></td></tr> 
    </table> 
    <button type="submit">Submit</button> 
    </form> 
</div> 

的PHP refreshTargets調用是

if($_GET['function']=="drawTargets") 
    { 
     $gameNo = $_GET['gameShots']; 
     $roundName = $_GET['roundShots']; 
     $sql=mysql_query("SELECT * FROM tbl_Round WHERE match_id='$gameNo' && round_name='$roundName'") 
      or die(mysql_error()); 
     while ($row = mysql_fetch_array($sql)) { 
      echo '<p><a href="admin.php?targetNo='.$row["target_name"].'&gameNo='.$gameNo.'&roundName='.$roundName.'"><button class="but" id="fillshots" type="button">'.$row["target_name"].'- Player'.$row['player_id'].'</button></a></p>'; 
     } 
    } 

Answer 1

您需要使用事件代表團的點擊處理程序，因爲.but是一個動態插入的元素：

$('.targetinfo').on('click', '.but', function(e) { 
    e.preventDefault(); 
    $('.contentfill').hide(); 
    $('#' + this.id + 'div').show(); 
});