2015-04-07 135 views
-1

爲什麼JavaScript的工作在這裏很好:FiddleJavaScript的工作不

但不是當我保存它,並在script html標籤包裝body標籤內的JavaScript,然後在瀏覽器中打開。複選框不響應,所有列都顯示在瀏覽器中,而某些列默認情況下應該隱藏。

<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> 
+0

嘗試'' –

+0

我這樣做,並把它放在。仍然不起作用。 – user3817597

+0

你有沒有包含相應的jQuery文件? – Pugazh

回答

0

你是指jQuery的1.11+,並使用$("#opt4").live(..)

現場被depricated jQuery的1.7+

使用$("#opt4").on()代替。 (使用.on,無論你使用的是什麼地方.live

請參閱this正在工作。

+0

嗨,是的,你的小提琴作品的例子很好,但是當我將它複製粘貼到頭部並將其包裹在

1

看來你還沒有列入的jquery.js文件到您的例子中,他們已經包括jQuery的1.7.2,

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

上面的代碼jQuery的文件運行應納入參考的jsfiddle例子你的文件。

+0

啊哈,是的!添加jQuery 1.7.2修復了這個問題!謝謝! – user3817597