javascript - 引用错误: $ is not defined issue

Question

我刚刚在控制台中收到一条错误消息，内容为引用错误:$未定义。这就是为什么我的表单数据在单击单选按钮后未加载。你能告诉我我的代码有什么问题吗？谢谢。

<form id='group'>
<label><input type="radio" name="group1" class="sim-micro-btn"/></label>
<label><input type="radio" name="group1" class="sim-mini-btn"/></label> 
<label><input type="radio" name="group1" class="sim-maxi-btn"/></label>
<label><input type="radio" name="group1" class="sim-mega-btn"/></label>
<label><input type="radio" name="group1" class="phone-smart-micro-btn"/></label>
<label><input type="radio" name="group1" class="phone-smart-mini-btn"/></label>
<label><input type="radio" name="group1" class="phone-smart-btn"/></label>
<label><input type="radio" name="group1" class="phone-smart-maxi-btn"/></label>
</form>

<div class="billpay-internet-add-ons">
  <div class="sim-micro-desktop">sim-micro</div>
  <div class="sim-mini-desktop">sim-mini</div>
  <div class="sim-maxi-desktop">sim-maxi</div>
  <div class="sim-mega-desktop">sim-mega</div>
  <div class="phone-smart-micro-desktop">phone-smart-micro</div>
  <div class="phone-smart-mini-desktop">phone-smart-mini</div>
  <div class="phone-smart-desktop">phone-smart</div>
  <div class="phone-smart-maxi-desktop">phone-smart-maxi</div>
</div>

<script>
$('form#group').click(function(e) {
    var className = e.target.className.replace('btn', 'desktop');    
    $('.' + className).show().siblings().hide();
});
</script>

Answer 1

您缺少对 jQuery 库的引用。

<小时/> 在使用 jQuery 之前添加 jQuery 库

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

<script>
$('form#group').click(function(e) {
    var className = e.target.className.replace('btn', 'desktop');    
    $('.' + className).show().siblings().hide();
});
</script>