Bootstrap iframe模式

Question

我尝试在点击特定div时使用引导程序嵌入iframe模式。这是我的html和javascript代码。

HTML DIV

<li class="list-group-item" id = "itbot" >
          <div class="botsIcon">
              <i class="fa fa-ticket" aria-hidden="true"></i>

          </div>
        <div class="bots">
          <b> IT Help Desk</b><br />
              Click here to fix any issue in your machine if you have on your machine.
        </div>
 </li>

BOOT STRAP IFRAME MODAL：

 <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">×</button>
      <h3>Chat Agent</h3>
    </div>
    <div class="modal-body">
      <iframe src="http://##.##.##.##:5000" style="zoom:0.60" width="99.6%" height="250" frameborder="0"></iframe>
    </div>
    <div class="modal-footer">
      <button class="btn" data-dismiss="modal">Close</button>
    </div>

 </div>

JavaScript代码：

<script type="text/javascript">

var frameSrc = "http://##.##.##.##:5000"

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

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

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

});

 </script>

但是我在控制台中出现错误

  

$（'＃myModal'）。on（'show'，function（）不是函数

任何人都可以帮助我，因为我是UI开发的新手。