javascript - 无法在单个页面上的div标签上加载不同的html

我有一个疑问，我有选择选项，在那个选择选项上我有不同的选择
当我单击它时，它将加载该HTML文件，并且它对于两个选项均适用，但对于第三个选项，
效果不佳，在单击第二个选项时，它会显示错误消息，例如
“未捕获的TypeError:无法读取未定义的属性'is'”

这是我的代码

$(function() {
  $('#type').change(function() {
    if ($('#type').val() == 'a') {

        $('#loadCheckHere').load('./templates/a.html');
      }
    } else if ($('#type').val() == 'b') {

        $('#loadCheckHere').load('./templates/b.html');

    } else {
      alert('select properly');
      $('#loadCheckHere').load('./templates/c.html');
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="type" id="type" style="margin-left:57px;width:180px;">
 <option name="" value="">Select Asset Recovery</option>
 <option name="a" value="a">Add A</option>
 <option name="b" value="b">Add B</option>
 <option name="c" value="c">Add C</option>
</select>

<!--This is div tag,Here only I'm loading different html-->
<div id="loadCheckHere" style="background-color:white"></div>

最佳答案

我添加了一个插头，检查一下

Plunker link

事情对我来说很好

$(function() {
  $('#type').change(function() {
    if ($('#type').val() == 'a') {

      $('#loadCheckHere').load('a.html');

    } else if ($('#type').val() == 'b') {

      $('#loadCheckHere').load('b.html');

    } else {
      //alert('select properly');
      $('#loadCheckHere').load('c.html');
    }
  });
});