5

単純な DIV があり、hide() と show() を取得できません。

私はそれを正しくやっていると思いますが、何が悪いのかを見つけることができません。

<div id="thediv" >hola</div>
<input type="button" value="click to show">This is the div content</input>

$(document).ready(function() {
    $("div#thediv").hide();
    alert($("div#thediv").hide().attr("id"));
});

$("button").click( function() {
    $("div#thediv").show();
    alert('click');
});

また、リンクhttp://jsfiddle.net/rt9Fc/ 」でフィドルを作成しました。

何か案は?

4

5 に答える 5

10

クリック ハンドラーを document.ready 内に配置し、セレクターを$("input:button")-に変更します。

$(document).ready(function () {
    $("div#thediv").hide();
    alert($("div#thediv").hide().attr("id"));
    $("input:button").click(function () {
        $("div#thediv").show();
        alert('click');
    });
});

デモ---> JsFiddle

于 2013-06-27T16:34:30.070 に答える
5

コードのより適切なバージョンがあります: JsFiddle

HTML:

<div id="thediv">hola</div>
<input type="button" value="click to show"/>

JavaScript:

$(function() {
    var $myDiv = $("#thediv");
    $myDiv.hide();
    alert($myDiv.attr("id"));

   $("input[type=button]").on('click', function() {
      $myDiv.show();
      alert('click');
    });
});

役立つメモ:

  • キャッシュ DOM 要素の検索は、検索にコストがかかるため
  • クリックの代わりに使用すると、より高速に動作します
  • $function()は document.ready のエイリアスです。書き込みが速く、ネットワーク経由で送信するバイト数が少なくなります:)
  • div#id セレクターを使用する必要はありません。ページ内で一意である必要があるため、#id で十分です。さらに、jquery が findElementById JavaScript 関数を使用した後、div の追加チェックを実行する必要はありません。
  • jQuery のパフォーマンスに関する素晴らしい記事があります: artzstudio
  • 入力を開始タグと終了タグに分割しないでください。

おそらくあなたはこれが欲しかった:

HTML:

<div id="thediv">
    hola
    <input type="button" value="click to show"/>
</div>

そうすれば、JavaScript を最適化できます。

$(function() {
    var $myDiv = $("#thediv");
    $myDiv.hide();
    alert($myDiv.attr("id"));

   $myDiv.find("input[type=button]").on('click', function() {
      $myDiv.show();
      alert('click');
    });
});
于 2013-06-27T16:42:11.473 に答える
1

ボタン セレクターを入力に変更する:buttonか、入力を使用します。buttonセレクターは<button>Somebutton</button>

$(document).ready(function() {

   var $thediv = $('#thediv').hide(); //Cache the object here. Also you can shain it through

    $(":button").click( function() {
    $thediv.show();
    alert('click');
});
});

フィドル

ID がある場合は、タグ名を前に付けないでください。セレクターが遅くなります。#thedivの代わりに使用してdiv#thedivください。また、複数の場所で使用している場合は、jquery オブジェクトを変数にキャッシュしてみてください。これにより、毎回 jquery オブジェクトの作成を呼び出す必要がなくなります。

于 2013-06-27T16:35:26.623 に答える