我有以下代碼需要添加到我在Wordpress中處理的模板文件中。我使用php wp_enqueue_script(「jquery」)調用jquery;這是版本1.8.3。我已經在header.php文件中添加了腳本,雖然我可以使用Dreamweaver在本地執行此操作,但當我試圖在wordpress中運行時,我無法弄清楚什麼是錯誤的。將jquery添加到Wordpress
這裏是我正在使用的代碼:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - jsFiddle demo</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.3.js'></script>
<script type='text/javascript'>
$(window).load(function(){
function sortUsingNestedText(parent, childSelector, keySelector) {
var items = parent.children(childSelector).sort(function (a, b) {
var vA = $(keySelector, a).text();
var vB = $(keySelector, b).text();
return (vA < vB) ? -1 : (vA > vB) ? 1 : 0;
});
parent.append(items);
}
/* setup sort attributes */
$('#sLocation').data("sortKey", "span.wpcf-field-location-value");
$('#sSchool').data("sortKey", "span.wpcf-field-schools-value");
/* sort on button click */
$("button.btnSort").click(function() {
sortUsingNestedText($('#sortThis'), "div", $(this).data("sortKey"));
});
});
</script>
</head>
<body>
<div id="sortThis">
<div class="fp-floorplans">
<div class="fp-link">
<a href="#">Community 1</a>
</div>
<div id="wpcf-field-location" class="wpcf-field-checkboxes wpcf-field-location"><span class="wpcf-field-name wpcf-field-checkboxes wpcf-field-location-name">Loation:</span> <span class="wpcf-field-value wpcf-field-checkboxes-value wpcf-field-location-value">South</span>
</div>
<div id="wpcf-field-schools" class="wpcf-field-textfield wpcf-field-schools"><span class="wpcf-field-name wpcf-field-textfield wpcf-field-schools-name">School(s):</span> <span class="wpcf-field-value wpcf-field-textfield-value wpcf-field-schools-value">Southwest</span>
</div>
<div id="wpcf-field-price-starting-at" class="wpcf-field-textfield wpcf-field-price-starting-at"><span class="wpcf-field-name wpcf-field-textfield wpcf-field-price-starting-at-name">Price Starting At:</span> <span class="wpcf-field-value wpcf-field-textfield-value wpcf-field-price-starting-at-value">$100's</span>
</div>
</div>
<div class="fp-floorplans">
<div class="fp-link">
<a href="#">Community 3</a>
</div>
<div id="wpcf-field-location" class="wpcf-field-checkboxes wpcf-field-location"><span class="wpcf-field-name wpcf-field-checkboxes wpcf-field-location-name">Loation:</span> <span class="wpcf-field-value wpcf-field-checkboxes-value wpcf-field-location-value">North</span>
</div>
<div id="wpcf-field-schools" class="wpcf-field-textfield wpcf-field-schools"><span class="wpcf-field-name wpcf-field-textfield wpcf-field-schools-name">School(s):</span> <span class="wpcf-field-value wpcf-field-textfield-value wpcf-field-schools-value">Crowder</span>
</div>
<div id="wpcf-field-price-starting-at" class="wpcf-field-textfield wpcf-field-price-starting-at"><span class="wpcf-field-name wpcf-field-textfield wpcf-field-price-starting-at-name">Price Starting At:</span> <span class="wpcf-field-value wpcf-field-textfield-value wpcf-field-price-starting-at-value">$100's</span>
</div>
</div>
<div class="fp-floorplans">
<div class="fp-link">
<a href="#">Community 2</a>
</div>
<div id="wpcf-field-location" class="wpcf-field-checkboxes wpcf-field-location"><span class="wpcf-field-name wpcf-field-checkboxes wpcf-field-location-name">Loation:</span> <span class="wpcf-field-value wpcf-field-checkboxes-value wpcf-field-location-value">East</span>
</div>
<div id="wpcf-field-schools" class="wpcf-field-textfield wpcf-field-schools"><span class="wpcf-field-name wpcf-field-textfield wpcf-field-schools-name">School(s):</span> <span class="wpcf-field-value wpcf-field-textfield-value wpcf-field-schools-value">Northeast</span>
</div>
<div id="wpcf-field-price-starting-at" class="wpcf-field-textfield wpcf-field-price-starting-at"><span class="wpcf-field-name wpcf-field-textfield wpcf-field-price-starting-at-name">Price Starting At:</span> <span class="wpcf-field-value wpcf-field-textfield-value wpcf-field-price-starting-at-value">$100's</span>
</div>
</div>
</div>
<button id="sLocation" class="btnSort">Sort By Location</button>
<br />
<button id="sSchool" class="btnSort">Sort By School</button>
<br />
</body>
</html>
任何意見或幫助是極大的讚賞!
在Firefox中獲取Chrome開發工具或Firebug可能是一個想法,讓您對運行時是否收到任何javascript錯誤有一點了解。 – 2013-04-08 01:06:51
在JS控制檯中的任何錯誤?你能確認jQuery *是*加載嗎? – 2013-04-08 01:11:44
在JS控制檯沒有錯誤,我正在使用Firebug。 jQuery正在加載 - 在視圖源代碼中可以看到。 – user1172854 2013-04-08 01:23:43