代码在 JSFiddle 中有效，但在 Web 浏览器或 Dreamweaver 中无效答案

【问题标题】：Code works in JSFiddle but not in Web Browser or Dreamweaver代码在 JSFiddle 中有效，但在 Web 浏览器或 Dreamweaver 中无效
【发布时间】：2017-04-05 21:34:05
【问题描述】：

此代码在 JSFiddle 中运行良好，但是当我放入 Dreamweaver 文档或在浏览器中尝试时，div 永远不会显示。目的是让 div 'sreturned' 显示用户何时从下拉列表中选择值 '1'。我将代码放在两个单独的文件中并将它们链接起来。非常感谢任何帮助。

这里是 HTML

<body>
 <script type="text/javascript" src="file:///Macintosh%20HD/Applications/MAMP/htdocs/thesurebettor/Untitled-2.js"></script>
 <select id = "typeoption"> 
 <option value="0">Qualifying Bet</option>
 <option value="1">Free Bet</option>
 <option value="2">Risk Free Bet</option>
 </select>
 <div style='display:none;' id='sreturned'> Stake Returned
 </div>
</body>

这是脚本

    $(document).ready(function(){
        $('#typeoption').on('change', function() {
            if ( this.value == '1')
          {
            $("#sreturned").show();
          }
          else
          {
             $("#sreturned").hide();
           }
        });
    });

【问题讨论】：

在浏览器中打开开发者工具。看看控制台。阅读错误消息。我可以看到两个可能（但完全未发布）的竞争者。
看来您使用的 jquery 没有包含它。
加格。在我之前的评论中，“不相关”不是“未发布”。
@JordiNebot — 脚本元素在问题中的位置没有问题。（也：W3Schools，ick）

标签： javascript html dreamweaver show-hide

【解决方案1】：

编辑：JSFiddle 在所有页面中包含 jquery

你有添加 jquery 脚本吗？试试这个文件：

<body>
 <script type="text/javascript" src="file:///Macintosh%20HD/Applications/MAMP/htdocs/thesurebettor/Untitled-2.js"></script>
 <select id = "typeoption">
 <option value="0">Qualifying Bet</option>
 <option value="1">Free Bet</option>
 <option value="2">Risk Free Bet</option>
 </select>
 <div style='display:none;' id='sreturned'> Stake Returned
 </div>
</body>


<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script>
 $(document).ready(function(){
     $('#typeoption').on('change', function() {
         if ( this.value == '1')
       {
         $("#sreturned").show();
       }
       else
       {
          $("#sreturned").hide();
        }
     });
 });
</script>

【讨论】：

感谢您的回答。当我将它全部添加到 HTML 文件中时，这有效，但是当我将它添加到单独的 js 文件中时，我无法让它工作。如何在外部js文件中包含脚本src代码？
要添加 jquery，您需要在您的 html 中添加这一行：“
感谢您验证我的回答^^
太棒了，它现在可以工作了.. 我将如何在“#sreturned”之后向显示/隐藏代码行添加更多 div？
我的英语太差了...如果你想在同一个函数中屏蔽更多元素，你可以改变选择器 jquery ： "$("#sreturned, #sreturned2, .sreturned1").show() ;"。这就是你想要的？