1

そこで、JQuery と、その Web コンテンツおよび Web アプリケーションでの使用について理解を深めたいと思っているので、ここで聞いてください。このテスト ページの目標は、ボタンを使用してコンテンツを変更、作成、および削除できるようにすることです。別の目標は、「Enter」キーを使用してテキスト ボックスのボタンの 1 つをクリックする機能をテストすることです (ユーザーが Enter キーを使用して送信ボタンをクリックすることをシミュレートします)。これは私が開発したコードで、「destroyContent」が定義されていないというエラーを修正する方法について少し混乱しています。明らかに私の構文はオフですが、修正方法がわかりません。誰かが助けてくれたり、役立つ参考資料を教えてくれたりできますか?

JQuery:

$(document).ready(function () {
    $('#Scan').keypress(keyHandler);
});
$.keyHandler = function (e) {
    if (e.which == 13) {
        $(this).blur();
        $('#destroy').focus().click()
    }
}
$.changeHeading1 = function () {
    x = document.getElementById("Heading1")
    x.innerHTML = "It has changed";
}
$.createContent = function () {
    var para = document.createElement("p");
    var node = document.createTextNode("This is new");
    para.appendChild(node);

    var element = document.getElementById("div1");
    element.appendChild(para);
}
$.destroyContent = function () {
    var child = document.getElementById("p1");
    child.parentNode.removeChild(child);
}

(私の実際のコードではもっと良く見えると約束しますが、ここでフォーマットするのに苦労しています)

HTML の場合:

<h1 id="Heading1" />
<p id="p1" />
<button type="text" id="Scan" />
<button type="button" onclick="changeHeading1()" />
<button type="button" onclick="createContent()" />
<button type="button" id="destroy" onclick="destroyContent()" />
4

2 に答える 2

2

destroyContentのメンバーとして作成していますが$、そのように呼び出していません:

$.destroyContent = function () {対onclick="destroyContent()"

destroyContentの外側で定義するか、で$呼び出す必要があり$ます。次のいずれか:

function destroyContent() {
    var child = document.getElementById("p1");
    child.parentNode.removeChild(child);
}

また

<button type="button" id="destroy" onclick="$.destroyContent()">

于 2013-05-01T19:01:20.280 に答える
2

最初に役立つ可能性がある$のは、グローバル名前空間の単なる変数です。この場合はwindow. Chrome コンソールに移動すると、これが表示されますwindow.$。それについて特別なことは何もありません。window.jQueryと同じものもありwindow.$ます。

したがって、関数にアクセスすると、現在のスコープで変数を取得しようとします。だからあなたがするとき：

<button type="button" id="destroy" onclick="destroyContent()" />

するのと同じwindow.destroyContent()です。$ 変数のプロパティであるバージョンにアクセスする場合。したがって、次のいずれかを変更できます。

onclick="$.destroyContent()"
onclick="window.$.destroyContent()"

しかし、jQuery をよりよく理解したいので、(ほとんどの人が示唆するように) ハンドラーをマークアップに追加することは避けます。代わりに、たとえば jQuery を介してハンドラーを作成します。

$('#destroy').click(function() {
  var child = document.getElementById("p1");
  child.parentNode.removeChild(child);
});

jQuery イベント API を読むと、これを行う方法をよりよく理解するのに役立ちます。彼らは素晴らしい例を持っています:)

于 2013-05-01T19:09:55.513 に答える