爲什麼不執行此JavaScript？

我想獲得一點jQuery的jinja2模板內工作。預期的行爲是檢查SelectAll框將檢查其餘的框。我已經爲.change事件添加了一個警報來開始調試，並且我發現它沒有運行。所以這個腳本永遠不會被調用。爲什麼不執行此JavaScript？

我在做什麼錯？

{% extends "layout.html" %} 
{% block head %}<head> 
{% block title %}Home{% endblock %} 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(':checkbox[name=selectAll]').change (function() { 
    $(':checkbox[name=instances]').prop('checked', this.checked); 
    alert("FOO"); 
}); 
</script> 
</head> 
{% endblock %} 
{% block body %} 

<form target="" method="GET" id="testform"> 
<div> 
Select All: <input type="checkbox" name="selectAll" id="selectAllInstances" /> <br /> 
    {% for k in tests %} 
    <input type="checkbox" name="instances" value="{{ k[1].mongo_id }}">{{ k[0] }} <br /> 
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Description: {{ k[1].__doc__ }} <br /> 
    {% endfor %} 
</div> 
    <br /> 
    <br /> 
    <input type="submit"> 
</form> 
{% endblock %}

來源

2013-01-11 munk

document.ready函數:)你應該通讀這個幫助你學習基礎http://stackoverflow.com/tags/jquery/info –

通過這條線執行時間：

$(':checkbox[name=selectAll]').change(...);

沒有複選框命名全選 - 它下面的腳本定義。包裹。就緒事件中的代碼：

$(document).ready(function(){ 
});

當DOM分層已全部構建（簡單的話，當瀏覽器已經看到</html>）的事件觸發。

來源

2013-01-11 20:47:14

該模板是一個紅色的鯡魚。當綁定事件處理程序的腳本運行時，您的複選框不存在。

您有幾個選項。

複選框
裹在一個函數的腳本和延遲調用它，直到後來（例如用的document.ready事件）之後移動腳本元件在HTML的點。使用event delegation而不是直接綁定。

來源

2013-01-11 20:43:01 Quentin

你需要用你的jQuery中的document.ready即

$(function(){ 
    $(':checkbox[name=selectAll]').change (function() { 
    $(':checkbox[name=instances]').prop('checked', this.checked); 
    alert("FOO"); 
    }); 
});

沒有它的腳本運行之前DOM元素已經準備好進行遍歷

注：

$(function(){...code here ...});

簡寫爲

$(document).ready(function(){ 
//your code 
});

來源

2013-01-11 20:45:05

爲什麼不執行此JavaScript？

回答

相關問題