如何使JQuery工作？

Question

嗨:)我一直在玩javascript，現在想查看JQuery。 我仍然需要學習很多東西，所以請保持親切:)我從網絡上獲取了一個代碼，現在我試圖使其正常工作。 Jsfiddle可以工作，只是不想在我的服務器上工作。 這是代碼：

<!DOCTYPE html> 

<html lang="en"> 

<head>
<meta charset="UTF-8">

<script type="text/javascript" src="http://localhost/play/jquery-2.1.1.min.js"></script>

<script type="text/javascript" src="jquery-2.1.1.min.js"></script>

<script type="text/javascript" language="javascript">
function getNum(element, attrPrefix) {
    //set prefix, get number
    var prefix = attrPrefix;
    var num = element.attr("id").substring((prefix.length));
    return num;
}

$(":checkbox").change(function() {
    var num = getNum($(this), "checkbox_");
    if ($(this).is(":checked")) {
        $("#color_" + num).val($(this).val());
    } else {
        $("#color_" + num).val("");
    }
});

</script>

</head>

<body>

<p>Input boxes are populated with value of checkbox when checkbox is checked.</p>

<p><input type="checkbox" id="checkbox_01" name="checkbox" value="red was checked" />red 01<br />
    <input type="checkbox" id="checkbox_02" name="checkbox_02" value="green was checked" />green 02<br />
    <input type="checkbox" id="checkbox_03" name="checkbox_03" value="blue was checked" />blue 03</p>

<table>
    <tr>
        <td>color 01<input type="text" id="color_01" name="color_01" /></td>
    </tr>
    <tr>
        <td>color 02<input type="text" id="color_02" name="color_02" /></td>
    </tr>
    <tr>
        <td>color 03<input type="text" id="color_03" name="color_03" /></td>
    </tr>
</table>


<body>
</html>

無論我將src更改為什么，它都不想使JQuery變得麻煩。 我將min文件直接復制到名為play的wamp prjtect目錄中。 我用了：

<script type="text/javascript" src="http://localhost/play/jquery-2.1.1.min.js"></script>

<script type="text/javascript" src="jquery-2.1.1.min.js"></script>

請讓我知道我可以做些什么！ 在此先感謝:)注意：我是網絡開發人員的初學者;）

Answer 1

將您的代碼包裝在DOM ready處理程序中。 然后刪除任何一個jquery參考文件，否則使用jquery CDN庫。

<script src="http://code.jquery.com/jquery-latest.min.js"/>

碼：

$(document).ready(function(){
function getNum(element, attrPrefix) {
    //set prefix, get number
    var prefix = attrPrefix;
    var num = element.attr("id").substring((prefix.length));
    return num;
}
$(":checkbox").change(function() {
    var num = getNum($(this), "checkbox_");
    if ($(this).is(":checked")) {
        $("#color_" + num).val($(this).val());
    } else {
        $("#color_" + num).val("");
    }
});
});

演示：

http://jsfiddle.net/9fLXL/

Answer 2

請嘗試將您的js / jquery代碼包裝在

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

要么

$(function() {
    //your code here
});

如何使JQuery工作？

問題描述

2 個解決方案

解決方案1
0 已采納 2014-07-26 16:51:33

解決方案2
0 2014-07-26 16:59:45

如何使JQuery工作？

問題描述

2 個解決方案

解決方案1 0 已采納 2014-07-26 16:51:33

解決方案2 0 2014-07-26 16:59:45

解決方案1
0 已采納 2014-07-26 16:51:33

解決方案2
0 2014-07-26 16:59:45