我对JQuery有点陌生。我一直在尝试使用这个Jquery http://jsfiddle.net/54pp2/2/,
<input id="click" type="button" value="click" />
<label id="test">Test</label>
$(document).ready(function () {
var textArray = [];
textArray[0] = 'test 1';
textArray[1] = 'test 2';
textArray[2] = 'test 3';
textArray[3] = 'test 4';
var idx = 0;
$('input#click').on('click', function() {
idx++;
var newidx = idx % textArray.length;
$('label#test').text(textArray[newidx]);
});
});
但是当我把它放在我的主题代码,它不会工作,即使jsfiddle显示它工作得很好
如果你想看:http://dialoguetest.tumblr.com/
(当您单击侧边栏上的粉红色按钮时,描述文本将发生变化。但是您只能单击它一次,这与jQuery代码不同,jQuery代码允许在文本更改时多次单击按钮。
当我尝试使用jQuery时,它不会工作:http://dialoguetest2.tumblr.com/
有什么我错过了吗?我知道我必须加上
<script type="text/javascript">
并以
结尾</script>
以使其工作。但是还有什么我错过了,像使用谷歌AJAX库API吗?
如果是,怎么可能呢?
要在HTML页面中工作,您需要在head
中放置一个脚本引用到jQuery以及您的JS代码(在DOM就绪处理程序中)。像这样:
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript>
$(document).ready(function () {
var textArray = [];
textArray[0] = 'test 1';
textArray[1] = 'test 2';
textArray[2] = 'test 3';
textArray[3] = 'test 4';
var idx = 0;
$('input#click').on('click', function() {
idx++;
var newidx = idx % textArray.length;
$('label#test').text(textArray[newidx]);
});
});
</script>
</head>
<body>
<input id="click" type="button" value="click" />
<label id="test">Test</label>
</body>
</html>