问更改javascript上的src iframe不工作

EN

<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog modal-lg">
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
    </div>
    <div class="modal-body">
  <iframe src=""  id="iframePOP" style="zoom:0.60" width="99.6%" height="250" frameborder="0"></iframe>

    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default text-center" data-dismiss="modal">close</button>
    </div>
  </div>
</div>

 function ShowPopup(id) {



        $('#myModal').on('show', function () {

                   document.getElementById("iframePOP").src="/Game.aspx?GameId=" + id;


        });
        $('#myModal').modal({ show: true })

    }

 function ShowPopup(id) {
        var frameSrc = "/Game.aspx?GameId=" + id;


        $('#myModal').on('show', function () {

            $('iframe').attr("src", frameSrc);


        });
        $('#myModal').modal({ show: true })

    }