当我在浏览器中打开HTML文件时，javascript不起作用

javascript not working when I open the HTML file in browser

本文关键字：文件 javascript 不起作用 HTML 浏览器      更新时间：2023-09-26

为什么javascript在这里工作良好：Fiddle

但当我保存它并将javascript封装在body标记中的script html标记中，然后在浏览器中打开时，就不会了。复选框不响应，所有列都显示在浏览器中，而某些列默认情况下应该隐藏。

 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 <title>čezožinski odnosi</title>
 <link rel="stylesheet" type="text/css" href="timeline.css">
 <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.js"></script>
 <script>
$(document).ready(function() {
if($("#opt1").is(":checked")){
     $("#col1").show();
    $(".data1").show();   
}else{
     $("#col1").hide();
    $(".data1").hide();
}
if($("#opt2").is(":checked")){
     $("#col2").show();
    $(".data2").show();   
}else{
     $("#col2").hide();
    $(".data2").hide();
}    
if($("#opt3").is(":checked")){
     $("#col3").show();
    $(".data3").show();   
}else{
     $("#col3").hide();
    $(".data3").hide();
}
if($("#opt4").is(":checked")){
     $("#col4").show();
    $(".data4").show();   
}else{
     $("#col4").hide();
    $(".data4").hide();
}

$("#opt1").live('click', function() {
    if($("#opt1").is(":checked")){
     $("#col1").show();
    $(".data1").show();   
}else{
     $("#col1").hide();
    $(".data1").hide();
}
});
$("#opt2").live('click', function() {
   if($("#opt2").is(":checked")){
     $("#col2").show();
    $(".data2").show();   
}else{
     $("#col2").hide();
    $(".data2").hide();
}
});
$("#opt3").live('click', function() {
    if($("#opt3").is(":checked")){
     $("#col3").show();
    $(".data3").show();   
}else{
     $("#col3").hide();
    $(".data3").hide();
}
});
$("#opt4").live('click', function() {
    if($("#opt4").is(":checked")){
     $("#col4").show();
    $(".data4").show();   
}else{
     $("#col4").hide();
    $(".data4").hide();
}
});    
});
</script>
</head>

您的示例中似乎没有包含jquery.js文件，在参考JSFiddle示例中，它们包含了jquery 1.7.2，

<script>
   $(document).ready(function() {
</script>

要运行上述代码，jquery文件应该包含在您的文档中。

您引用的是Jquery 1.11+，并使用$("#opt4").live(..)

直播在Jquery 1.7+上被降级

请改用$("#opt4").on()。（使用.live时，请使用.on）

看看这是有效的。

相关文章：